Work is continuing apace on the site I am working on: http://homepage.ntlworld.com/graham.reeds/space
Sometimes I need to split the page into two or more logical blocks. Naturally a horizontal rule would be the ideal divider for this. However the current method uses three images to blend it in with the border effect like so: <img src="images/left_middlebar.jpg" alt="" width="54" height="22" /><img src="images/center_middlebar.jpg" alt="" width="691" height="22" /><img src="images/right_middlebar.jpg" alt="" width="55" height="22" /> Logically the ideal solution would to wrap a couple of spans around the hr. That unfortunately causes validation to fail so div's are being employed instead: <div class="page-splitter splitter-left"> <div class="splitter-right"> <hr /> </div> </div> A little CSS: .page-splitter, .page-splitter hr, .splitter-left, .splitter-right { display: block; height: 22px; clear: both; } .page-splitter hr { border: none; margin-left: 54px; margin-right: 55px; background: #fff url(../images/center_middlebar.jpg) top left repeat-x; } .splitter-left, .splitter-right { width: 100%; } .splitter-left { background: transparent url(../images/left_middlebar.jpg) left top no-repeat; } .splitter-right { background: transparent url(../images/right_middlebar.jpg) right top no-repeat; } And the result can be seen halfway down: http://homepage.ntlworld.com/graham.reeds/space/ (ignore the problem with the adverts - I know they are broken). The bar works fine in Windows FF and O8. Unfortunately IE6 is broken. The middle central bar has a border and is lowered by around 10 pixels. The fix suggested for IE on http://www.sovavsiti.cz/css/hr.html doesn't actually work in this instance - my knowledge of CSS is limited so the why's and wherefore's are beyond me - so I again turn to this list for assistance. Thanks, Graham Reeds. ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/