Witam jak zrobić w CSS, aby obramowanie poszczególnych komórek tabeli nakładały się na siebie? Przykładowo jak jak mam kilka sąsiadujących ze sobą komórek to uzyskuję linię 2px, zamiast 1px. (załącznik)
0
2
table {
border-collapse: collapse;
}
table, th, td {
border: 1px solid black;
}
0
Dziękuję pięknie;)
0
Hmmm niestety , ale nie działa mi to w stu procentach. Po dodaniu kodu z collapse nie wyświetlają mi się niektóre boczne obramowania tak jak w załączniku.
0
Proszę:
<html>
<head>
<style type="text/css">
td
{
font-size: 20px; font-family: Verdana; color: #000000;
}
table
{
border-collapse: collapse;
}
.rama
{
border: 1px solid black;
}
</style>
</head>
<body>
<table width=500px bordercolor=#FFFFFF align="center" cellspacing="0" cellpadding="0">
<tr align="center">
<td class="rama" width=50px height=50px> </td>
<td class="rama" width=50px height=50px><b>1</b></td>
<td class="rama" width=50px height=50px><b>2</b></td>
<td class="rama" width=50px height=50px><b>3</b></td>
<td class="rama" width=50px height=50px><b>4</b></td>
<td class="rama" width=50px height=50px><b>5</b></td>
<td class="rama" width=50px height=50px><b>6</b></td>
<td class="rama" width=50px height=50px><b>7</b></td>
<td class="rama" width=50px height=50px><b>8</b></td>
<td class="rama" width=50px height=50px> </td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>A</b></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td class="rama" width=50px height=50px><b>A</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>B</b></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td class="rama" width=50px height=50px><b>B</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>C</b></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td class="rama" width=50px height=50px><b>C</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>D</b></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td class="rama" width=50px height=50px><b>D</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>E</b></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td class="rama" width=50px height=50px><b>E</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>F</b></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td class="rama" width=50px height=50px><b>F</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>G</b></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td class="rama" width=50px height=50px><b>G</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px><b>H</b></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td width=50px height=50px bgcolor=#FFCC00></td>
<td width=50px height=50px bgcolor=#800000></td>
<td class="rama" width=50px height=50px><b>H</b></td>
</tr>
<tr align="center">
<td class="rama" width=50px height=50px> </td>
<td class="rama" width=50px height=50px><b>1</b></td>
<td class="rama" width=50px height=50px><b>2</b></td>
<td class="rama" width=50px height=50px><b>3</b></td>
<td class="rama" width=50px height=50px><b>4</b></td>
<td class="rama" width=50px height=50px><b>5</b></td>
<td class="rama" width=50px height=50px><b>6</b></td>
<td class="rama" width=50px height=50px><b>7</b></td>
<td class="rama" width=50px height=50px><b>8</b></td>
<td class="rama" width=50px height=50px> </td>
</tr>
</table>
</body>
</html>
0
Pokażesz screen że działa? Z jakiej przeglądarki korzystasz? Bez żadnej zmiany w kodzie?
0
a no rzeczywiście na IE u mnie też działa za to na firefox i google chrome już nie działa.
0
W takim razie jaka może być przyczyna, że u mnie na firefox nie działa?
0
Podpowie ktoś?
0
Na co Ci te wszystkie bgcolor width height (dwa ostatnie z niepoprawnymi wartościami, bo te atrybuty HTML przyjmują wartość bez jednostki, co oznacza piksele, albo procenty (oczywiście w css jest z jednostkami)) przy <td>? Wydłuża kod, komplikuje zmiany, a można to wrzucić w css.
Dodatkowo wrzucaj takie rzeczy na serwisy takie jak jsbin.com - ułatwia to zobaczenie problemu:
http://jsbin.com/lofenisoqa/edit?html,output
A tu screenshot z Firefoxa: http://i.imgur.com/6Xr2mjA.png - pokaż u siebie
