[CSS][HTML]Tabelka z zaokrąglonymi rogami Opcje

[Baku12345]

Witam
Mam takie pytanie. Chciałbym uzyskać podobny efekt do tego

czyli tabelka z zaokrąglonymi rogami. Napisałem taki oto kod:

html:

Kod

<table>
  <tr><td rowspan=\"2\">Pore ipsu dolor sit amet (4ml)<br> consectetur:</td><td>Donsectet (n-53 ALA)</td><td>Onseetu (n-3 LAL)</td></tr>
  <tr><td>3,0 + jtu</td><td>5.0 + ctu</td></tr>
</table>

css:

Kod

table
  {
    margin: 15px 0;
    border: 1px solid #dddddd;
    border-radius: 10px;
    border-collapse: collapse;
  }

td
  {
    border: 1px solid #dddddd;
    padding: 5px;
  }

i nie wiem dlaczego, ale tabela wygląda tak

czyli bez zaokrągleń.

W poszukiwaniu rozwiązania mojego problemu natknąłem się na wypowiedź, że

Kod

border-radius: 10px;

i

Kod

border-collapse: collapse;

się ze sobą gryzą. Byłoby w tym trochę prawdy, bo kiedy wyłączam jedno, to drugie zaczyna działać. Problem w tym, że ja potrzebuję
jednego i drugiego, czyli zaokrągleń i połączonych obramowań komórek.

Wiem, że da się to zrobić, bo widziałem tak wyglądającą tabelę na jednej stronie. Pytanie tylko jak?
Proszę o pomoc w jej naprawieniu.

Z góry dziękuję i pozdrawiam

Ten post edytował Baku12345 9.09.2014, 20:39:19

[trueblue]

http://stackoverflow.com/a/2586780

[Baku12345]

dziękuję