jasonpc1
09-01-2010, 12:43 PM
Having problems with HTML validator kicking up a fuss with empty tags.
<b></b>
seems to be incorrect and I wish to make all my pages valid.
Can anyone suggest a better way to do this without using images.
Is there another tag i can use that will not cause this validation problem i have ?
CSS
.containercolour { position: relative; background: #E1E1E1; margin: 0px 5px; } /* BACKGROUND OF ROUNDED BOX */
.rtopcolour, .rbottomcolour { display: block; background:#FFFFFF; } /* OUTTER EDGE COLOUR */
.rtopcolour *, .rbottomcolour *{ display: block; height: 1px; overflow: hidden; background: #E1E1E1; } /* BACKGROUND OF ROUNDED BOX */
.r1{ margin: 0px 5px; line-height: 1px; }
.r2{ margin: 0px 3px; line-height: 1px; }
.r3{ margin: 0px 2px; line-height: 1px; }
.r4{ margin: 0px 1px; line-height: 1px; }
HTML
<div class="containercolour"><b class="rtopcolour"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
text
<b class="rbottomcolour4"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>
<b></b>
seems to be incorrect and I wish to make all my pages valid.
Can anyone suggest a better way to do this without using images.
Is there another tag i can use that will not cause this validation problem i have ?
CSS
.containercolour { position: relative; background: #E1E1E1; margin: 0px 5px; } /* BACKGROUND OF ROUNDED BOX */
.rtopcolour, .rbottomcolour { display: block; background:#FFFFFF; } /* OUTTER EDGE COLOUR */
.rtopcolour *, .rbottomcolour *{ display: block; height: 1px; overflow: hidden; background: #E1E1E1; } /* BACKGROUND OF ROUNDED BOX */
.r1{ margin: 0px 5px; line-height: 1px; }
.r2{ margin: 0px 3px; line-height: 1px; }
.r3{ margin: 0px 2px; line-height: 1px; }
.r4{ margin: 0px 1px; line-height: 1px; }
HTML
<div class="containercolour"><b class="rtopcolour"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
text
<b class="rbottomcolour4"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>