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>
<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;
}
{
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
