<hr>s in FF and Opera




Has anyone else ever had a problem with (or more importantly, does anybody have a solution to) FireFox and Opera showing

s vertically instead of horizontally? It seems to look just fine and normal in IE and Safari, but when I’m using FireFox or Opera for some reason some HRs show up as a really small line going vertically. There isn’t anything strange in the stylesheet about it. The doctype is in HTML 4.01 transitional and I did not put the / after the tag… so that’s alright. But there are several sites that I have seen this problem on, so it’s strange to me that when I Googled it I was unable to find a single reference to the issue.



Can you provide a url or two that demonstrates what you are seeing so we can look at it “in the wild”? :wink:



Here, try this: http://kustomfitness.com/login.php


That is strange! At first glance, I don’t see why it should be doing that (though I haven’t worked through all the CSS yet). Moving the

tag outside the div seems to produce the desired results … but I don’t understand yet why it is doing it in the first place.

It is clearly CSS related though - if you disable styles, the

displays as expected. I’m still playing with it, and see if I can figure out why it’s doing that. :wink:

addtional: Whatever is causing it to do that is not in the .fw-footer class - commenting it out produces the same result except that the vertical bar moves to being left-aligned instead of right. :open_mouth:



Your style sheet has:.fw-footer hr { display:inline; color:#C0C0C0; height:1px; }A horizontal rule is a block level element. By setting it to be an inline element, the “horizontalness” is collapsing as expected. IE isn’t showing this behavior because IE’s developers did not implement the specification properly. I have two pieces of advice:

  1. Use either CSS or elements. Don’t try to mix the two because you’ll only get yourself into a confusing mess.

  2. Examine the HTML and CSS specifications at the W3C website and learn which elements are block level, and which elements are inline. You will be surprised by some of the things you discover. In most cases, it is okay to turn inline elements into block level elements (, , etc.), but it is rarely a good idea to do the reverse.

Max discount on any plan with promocode SCJESSEYTOTAL


Ah! I feel particularly dense at the moment …thanks for the enlightenment! :slight_smile:



ooohhh. Thanks. Every time I looked over it I guess I didn’t even consider that the default display should have been block…