In IE6 I found that the border disappears in a combination of style, tags and preceding text. In IE the border around a block item(p, h1,h2 etc) will not be displayed when the containing div has a width in percentage or pixels and a positioning relative, with some preceding text.
How to display the border?
* Remove the content in the parent div (also an empty p will have this effect) and the border on the block item is displayed. (not really usefull though but you can test it) * Set width of the content style to auto and the border is displayed. (only usefull with a width of 100%(differs about 1 or 2 pixels with auto), and when you don't use a background color. * Dimension the block element for instance with the holy hack: * HTML .bordered{height:1%} * Remove position relative in container
Here is my example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <title>border test</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css" title="text/css"> .content { position: relative; width: 100%; } .bordered{ border: 1px solid #8AC; } </style> </head> <body > <div class="content"> content in 'content'-layer <div > <p class="bordered">This should be a block element WITH BORDER</p> </div> </div> </body> </html>
Nice catch. Same with any background-image/color.
Another method to display the border needs some user efforts: when you have more content wrapping, at least two lines of text in
<p class="bordered">Lorem ipsum...</p>
you can select a word in the last line, then deselecting by clicking again shows the missing blue border.
IE6 knows it has forgotten something ...
... to be serious:
.bordered:first-line {background: gray;}/* or your current background-colour*/
fixes it here too. Please don't ask /why/, but I feel somewhat tired of IE.
Ingo
______________________________________________________________________ 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/
