Помогите с border'om

[Motoko Kusanagi]

Это часть таблицы, мне нужно сделать двойной бордер, как на картинке. Не могу разобраться. Заднее затемнение задается посредством pngшки на классе .dark

Если ставлю border на tr и td они перекрывают друг друга.

<table>
<tr class="dark">
<td></td>
</tr>
</table>

Как это реализовать так же, как на картинке?

Edited November 5, 2011 by Motoko Kusanagi

[psywalker]

Ставь верхнюю границу бежевой, а нижнюю серой, у ячеек. А у таблицы сверху поставишь серый.

[Softlink]

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

[psywalker]

  On 11/6/2011 at 4:23 PM, Softlink said:

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

Ага, а елси ты не знаешь высоту ячейки?

Я бы короче делал так http://jsfiddle.net/A3MyY/2/

[Softlink]

  On 11/6/2011 at 4:32 PM, psywalker said:

  On 11/6/2011 at 4:23 PM, Softlink said:

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

Ага, а елси ты не знаешь высоту ячейки?

Ну не знаешь и не знаешь

С бордерами у таблицы вариант не самый удачный. Т.к. вдруг будет border-spacing выставлен или еще что. Так-то наверняка уже.

И вообще, завтра мы с тобой рубимся в шахматы

[psywalker]

  On 11/6/2011 at 4:36 PM, Softlink said:

  On 11/6/2011 at 4:32 PM, psywalker said:

  On 11/6/2011 at 4:23 PM, Softlink said:

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

Ага, а елси ты не знаешь высоту ячейки?

Ну не знаешь и не знаешь

Хаа, ну ты приколист)) http://jsfiddle.net/A3MyY/4/

  Quote

С бордерами у таблицы вариант не самый удачный. Т.к. вдруг будет border-spacing выставлен или еще что.

Сомневаюсь, на скрине этого нет, да и в коде тоже.

  Quote

И вообще, завтра мы с тобой рубимся в шахматы

А вот это уже реально)

[Softlink]

  On 11/6/2011 at 4:38 PM, psywalker said:

  On 11/6/2011 at 4:36 PM, Softlink said:

  On 11/6/2011 at 4:32 PM, psywalker said:

  On 11/6/2011 at 4:23 PM, Softlink said:

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

Ага, а елси ты не знаешь высоту ячейки?

Ну не знаешь и не знаешь

Хаа, ну ты приколист)) http://jsfiddle.net/A3MyY/4/

Да, так смотрится весьма уныло, я что-то совсем упустил этот момент)) В общем, нужно смотреть по ситуации

[psywalker]

  On 11/6/2011 at 4:44 PM, Softlink said:

  On 11/6/2011 at 4:38 PM, psywalker said:

  On 11/6/2011 at 4:36 PM, Softlink said:

  On 11/6/2011 at 4:32 PM, psywalker said:

  On 11/6/2011 at 4:23 PM, Softlink said:

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

Ага, а елси ты не знаешь высоту ячейки?

Ну не знаешь и не знаешь

Хаа, ну ты приколист)) http://jsfiddle.net/A3MyY/4/

Да, так смотрится весьма уныло, я что-то совсем упустил этот момент)) В общем, нужно смотреть по ситуации

Нет, ты ничего не упустил, просто у тебя в голове CSS3

[Softlink]

  On 11/6/2011 at 4:46 PM, psywalker said:

Нет, ты ничего не упустил, просто у тебя в голове CSS3

Не, у меня уже css5, который тянет высоту

[Softlink]

Погоди, ты меня не путай. Я же помню, что где-то делал уже подобное.

Пусть у тебя нет у ячеек высоты, но ты же можешь и наверняка задаешь ее таблице. Ведь почти в любом случае, она либо займет весь блок(что равносильно height:100%), либо тебе надо ее ограничивать высотой. И ты уже можешь смело пользоваться вложенным блоком. Так что вот так. http://jsfiddle.net/A3MyY/5/

Хоть это и ближе к частному случаю, но в то же время и более частому.

[psywalker]

  On 11/6/2011 at 5:08 PM, Softlink said:

Погоди, ты меня не путай. Я же помню, что где-то делал уже подобное.

Пусть у тебя нет у ячеек высоты, но ты же можешь и наверняка задаешь ее таблице. Ведь почти в любом случае, она либо займет весь блок(что равносильно height:100%), либо тебе надо ее ограничивать высотой. И ты уже можешь смело пользоваться вложенным блоком. Так что вот так. http://jsfiddle.net/A3MyY/5/

Хоть это и ближе к частному случаю, но в то же время и более частому.

Бред. Никто никогда почти не ограничивает высоту таблицы, а даже и если так (что редко), то в любом случае высота ячеек не фиксируется, чтобы ты не делал. Таков закон. Если текста будет чуть больше, чем строка или какой нибудь шрифт станет больше, то всё, пиши пропало. Считаю это очень плохим и некачественным решением.

[Softlink]

Да не видится мне пока универсального решения. Твое решение хорошо тем, что не надо ограничивать высоту и кода меньше. Но если надо делать отступы между ячейками, то все, оно уже не годится. У меня работает с отступами, но нужны размеры хотя бы height:100% для самой таблицы, а блоку, в который ты вкладываешь ее, можно уже задавать нужные.

Да и вообще, что стоит задать ячейке таблицы высоту в 1 пиксель. Контент ее растянет и будет все ок.

[psywalker]

Softlink,

  Quote

У меня работает с отступами, но нужны размеры хотя бы height:100% для самой таблицы, а блоку, в который ты вкладываешь ее, можно уже задавать нужные.

Твоя задача решается только в том случае, если мы ограничиваем высоту у ячеек. Что несёт в себе ряд проблем, которые равнозначны заданием высоты параграфу в надежде, что в нём не будет текста больше, чем одна строка)

http://jsfiddle.net/A3MyY/7/

  Quote

Твое решение хорошо тем, что не надо ограничивать высоту и кода меньше. Но если надо делать отступы между ячейками, то все, оно уже не годится.

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

У меня в ФФ жесть. http://jsfiddle.net/A3MyY/6/

[Softlink]

  On 11/6/2011 at 5:53 PM, psywalker said:

У меня в ФФ жесть. http://jsfiddle.net/A3MyY/6/

Точно, лажа получается. Вот вредный фф какой. Все время че-нибудь да запоганит с таблицами. Точнее, он вроде бы как правильно работает, но не на руку совсем. Ладно, варианты выложили, плюсы с минусами расписали, пусть ТС разбирается.

[psywalker]

  On 11/6/2011 at 6:04 PM, Softlink said:

  On 11/6/2011 at 5:53 PM, psywalker said:

У меня в ФФ жесть. http://jsfiddle.net/A3MyY/6/

Точно, лажа получается. Вот вредный фф какой.

Да нет, это не фф вредный, а кое-кто увлекается только CSS3

[Softlink]

  On 11/6/2011 at 6:05 PM, psywalker said:

Да нет, это не фф вредный, а кое-кто увлекается только CSS3

Если я и перестану увлекаться CSS3, то ФФ в мгновенье ока не начнет понимать position в таблице и вот такие фокусы с высотой, которые откровенно достают, ок?

[psywalker]

  On 11/6/2011 at 6:10 PM, Softlink said:

  On 11/6/2011 at 6:05 PM, psywalker said:

Да нет, это не фф вредный, а кое-кто увлекается только CSS3

Если я и перестану увлекаться CSS3, то ФФ в мгновенье ока не начнет понимать position в таблице и вот такие фокусы с высотой, которые откровенно достают, ок?

Да, не спорю, но зато ты уже сразу будешь видеть, что ты делаешь и насколько это непрактично, а не спорить до последнего

[Softlink]

  On 11/6/2011 at 6:12 PM, psywalker said:

Да, не спорю, но зато ты уже сразу будешь видеть, что ты делаешь и насколько это непрактично, а не спорить до последнего

Да кто ж спорил-то?))) Ты сделал одно решение, я другое. Одно работает с такими условиями, другое с другими. Делов-то. Просто я пытался его унифицировать, но не вышло, что ж поделаешь. С таким приколом с высотой в ФФ, честно сказать, столкнулся первый раз, буду знать теперь. И хоть тыщу лет бы я еще не знал этот css3, но при этом не пользовался бы табличной версткой, выдвинул бы точно такое же решение))

[psywalker]

Softlink,

Да лана, Шурик, я не в обиду же, просто часто вижу, что ты применяешь рискованные решения. Не хотелось бы, чтобы ты наткнулся на злого заказчика)

Советую тебе почаще прислушиваться, а то ты вот например говоришь:

  Quote

Одно работает с такими условиями, другое с другими.

Другое вообще НЕ имеет право на существование, мой совет, просто выкинь его из головы и никогда, никогда так не делай.

[Softlink]

  On 11/6/2011 at 6:22 PM, psywalker said:

Другое вообще НЕ имеет право на существование.

НЕ согласен Ладно, надо завязывать. Почисти лучше тему от флуда.

[psywalker]

  On 11/6/2011 at 6:25 PM, Softlink said:

  On 11/6/2011 at 6:22 PM, psywalker said:

Другое вообще НЕ имеет право на существование.

НЕ согласен Ладно, надо завязывать. Почисти лучше тему от флуда.

Не буду чистить, это не совсем флуд, наш разговор касался этой темы, пусть другие видят и делают выводы. Полезно.