Не удалось создать таблицу из 7 столбцов /3 строк с 1 пиксельным изображением, которое можно развернуть для имитации строк, как можно воспроизвести этот макет с помощью HTML и CSS без таблицы или изображения для "разделителей"?
Мне очень нравится, что линии не пересекаются.
<!-- layout reproduced -->
<TABLE BORDER="0" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR ALIGN="center">
<TD CLASS="boldedcolor4text">the first</TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="20"></TD>
<TD CLASS="boldedcolor4text">the second</TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="20"></TD>
<TD CLASS="boldedcolor4text">the third</TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="20"></TD>
<TD CLASS="boldedcolor4text">the fourth</TD>
</TR>
<TR ALIGN="center">
<TD COLSPAN="7"><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="520" HEIGHT="1"></TD>
</TR>
<TR ALIGN="center">
<TD><A CLASS="image" HREF="><IMG SRC="1.jpg" ALT="" BORDER="0"></A></TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="135"></TD>
<TD><A CLASS="image" HREF="><IMG SRC="2.jpg" ALT="" BORDER="0"></A></TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="135"></TD>
<TD><A CLASS="image" HREF="><IMG SRC="3.jpg" ALT="" BORDER="0"></A></TD>
<TD><IMG SRC="/gfx/Style1/color1.gif" ALT="" WIDTH="1" HEIGHT="135"></TD>
<TD><A CLASS="image" HREF="><IMG SRC="4.jpg" ALT="" BORDER="0"></A></TD>
</TR>
</TABLE>