> > >From: david <[EMAIL PROTECTED]> > > > > >Perhaps you could: > > > > >1. Leave the <hr> tags alone, unstyled except for one thing in CSS: hide > > >them. When CSS is enabled, the HR isn't shown. > > > > >2. Get the desired "horizontal rule" effects you want using the border > > >of either the block element above or below it. Much more power, that > > >way, and much better across browsers. > > > > Thanks very much, gentlemen. I've cleaned up the page, but haven't tried > > any cross-browser styles for hr elements. I need to progress further in > > CSS > > before I understand that coding well enough to use it. Instead, I first > > used > > top and bottom borders to provide visual separation. These worked > > fine until I reduced the size of the viewing window. When using <hr>, > > the horizontal rule separated the narrowed text perfectly. When using > > borders > > on existing <div> elements as separators, the effect was awful when the > > viewing > > window was reduced.
What do you mean by "awful"? Tells me nothing about what happened. > > http://www.sitkamusicfestival.org/6-strictindex.html > > http://www.sitkamusicfestival.org/6-strictssmf.css -- David [EMAIL PROTECTED] Sorry I wasn't very descriptive, David. When using <hr> elements as visual separators in the page and shrinking the viewing screen size, the logo appeared, below which was the text contained in the header, below that was the horizontal rule at the bottom of the header, and below that was the rest of the page, all in order and quite readable. As I recall, this was the case both in FF and IE7. When using the border of a separator <div> to define the bottom of the header section, shrinking the viewing screen (in IE7) causes the header text to overrun the bottom border line and the text below it, presenting an unintelligible mess (that is the "awful" which I mentioned). The text flows below the separating border even though the <div> with the separating border contains a "clear: both;" property. The presentation in Firefox, however, is clear and readable. Conversely, in the box for "Coming Events," lower on the page, all the text and separator lines appear in order and the text is again quite readable. Here, separators are provided by border lines on <h2> elements, rather than separator <div>'s. That probably accounts for the fact that the text isn't overriding lower text, as the separators are in the text elements themselves. I'm testing my pages in a reduced screen size to simulate a lower resolution screen, and in an even smaller screen, to simulate the view in a PDA-size screen. I may be mistaken about the validity of these tests. I'm also not terribly concerned about the above effects and may decide just to go ahead with the page as it is, or close to its present state. I don't have IE6 and am not aware how this page will show in that browser version, which may be a more significant problem. At any rate, thanks for your help and I'm still open to any suggestions you might have. Regards, Bob ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
