Как добавить пробелы между каждой строкой в ​​dataTable

Как добавить пробелы между каждой строкой таблицы. я пробую это

<p:dataTable styleClass="yourTableClass">
    <p:column style="background-color: ##EFF2F9">
         //Content here
    </p:column>
</p:dataTable>

Но это не работает

Я использовал Primefaces 2.2.1 введите здесь описание изображения


person Thang Pham    schedule 11.04.2011    source источник


Ответы (2)


Во-первых, проверьте марку/версию вашего браузера: border-spacing не поддерживается в IE6/7. Во-вторых, border-spacing работает только тогда, когда border-collapse таблицы установлено на separate. Вероятно, какая-то конкретная таблица стилей PrimeFaces установила для него значение collapse (что является предпочтительной формой представления границ в пользовательском интерфейсе). Таким образом, border-spacing не сработает.

Таким образом, все со всем этим должно работать, включая хак IE6/7 на последнем объявлении:

.yourTableClass { 
    border-collapse: separate; 
    border-spacing: 10px; 
    *border-collapse: expression('separate', cellSpacing = '10px');
}

с

<p:dataTable styleClass="yourTableClass">

(классы предпочтительнее встроенных стилей)


Обновление: согласно скриншоту и комментариям, PrimeFaces заключает сгенерированный HTML <table> в <div> и применяет к нему style/styleClass вместо завернутого <table>. Я не ожидал этого. В таком случае вам потребуется следующее объявление CSS:

.yourTableClass table { 
    border-collapse: separate; 
    border-spacing: 10px; 
    *border-collapse: expression('separate', cellSpacing = '10px');
}
person BalusC    schedule 11.04.2011
comment
все еще не могу заставить его работать. Поэтому я сделал именно то, что вы показали выше. Все равно ничего не изменится. Поэтому, когда я использую firebug для просмотра стиля, атрибут border-collapse: separate; перечеркивается. И я наследую border-collapse: collapse от .ui-datatable table. Я публикую скриншот своего стиля firebug в своем исходном коде, пожалуйста, посмотрите, BalusC - person Thang Pham; 11.04.2011
comment
Убедитесь, что этот стиль определен как последний стиль в порядке дерева HTML DOM. Если стиль PF появляется после вашего стиля, то он будет иметь приоритет. Редактировать: о, это смущает, я проверил скриншот, PF заключает таблицу в <div> и применяет к ней класс. Вместо этого попробуйте .yourTableClass table {}. - person BalusC; 11.04.2011
comment
да, это делает это. Большое спасибо: D - person Thang Pham; 11.04.2011

не совсем уверен насчет простых лиц, поэтому не знаю, какие атрибуты можно использовать для каких битов.

но border-spacing пока нельзя надежно использовать в качестве стиля.. таблицам все еще действительно нужен старомодный атрибут cellspacing

<p:dataTable cellspacing="10"> работает?

обновляется в соответствии с новой информацией

изменить правило

.yourTableClass {}

to

div div.yourTableClass table {}

если ваш layout.css вызывается до skin.css, это должно заставить правило переопределить его

и вам понадобится взлом IE, как указано выше, и, возможно, вам также нужно будет сделать его более конкретным

person clairesuzy    schedule 11.04.2011
comment
p:dataTable не имеет атрибута cellspacing, кстати, я использую PF 2.2.1 - person Thang Pham; 11.04.2011
comment
ах, извините, когда вы сказали, что пробовали интервал между границами, я предположил, что это таблица, может быть, фактические строки на самом деле не являются строками таблицы - tr - вы пытались просто добавить style="margin: 10px 0;", чтобы увидеть, делает ли это что-нибудь, я полагаю, что он принимает стиль атрибут, поскольку это то, что вы использовали в своем примере - person clairesuzy; 11.04.2011
comment
Кстати, я пытался получить доступ к сайту Primefaces, чтобы узнать, смогу ли я узнать больше, но для меня это время истекло. - person clairesuzy; 11.04.2011
comment
@clairesuzy: я думаю, что витрина временно не работает. Похоже, они переносят витрину на PF3.0 M1. Дайте ему пару часов, он должен вернуться в онлайн - person Thang Pham; 11.04.2011
comment
@Harry Pham, я вижу, что вы теперь исправлены, так что не беспокойтесь. ;) - person clairesuzy; 11.04.2011