No longer a <hr> tag in IE8?

  • NickN
  • Novice
  • Novice
  • NickN
  • Posts: 17

Post 3+ Months Ago

Hello

I've always been using a <hr> tag without a problem.
Since the release of IE8 it doesn't show anymore.
The problem doesn't occur in Mozilla Firefox.

Anyone had the same problem or knows a solution?

I'm using
Code: [ Select ]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
and a CSS:

Code: [ Select ]
hr { color: #B4C0CF; background-color: #B4C0CF; border: 0px solid #B4C0CF; }


Thanks in advance.

Nick
  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

try <hr /> instead of <hr> technically xhtml requires a closed tag so the tag with the slash in it is actually short hand for <hr></hr> I don't know for sure that IE8 will like it since I didn't test but I'm pretty sure I've run into similar issues.

Oh and you need to add a height to your CSS for an HR to display in ANY version of IE.
  • NickN
  • Novice
  • Novice
  • NickN
  • Posts: 17

Post 3+ Months Ago

I'm using <hr /> tags, so that isn't the problem.

I'll try adding the height.
  • tastysite
  • Proficient
  • Proficient
  • User avatar
  • Posts: 349
  • Loc: Brighouse, West Yorkshire, England

Post 3+ Months Ago

I gave up on the <hr /> tag a long time ago just use a div with a background and set it to tile along (x)
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8413
  • Loc: USA

Post 3+ Months Ago

tastysite wrote:
I gave up on the <hr /> tag a long time ago just use a div with a background and set it to tile along (x)

Not a good idea. I don't know why, but my instincts say its a bad idea.
  • webcosmo
  • Beginner
  • Beginner
  • User avatar
  • Posts: 37
  • Loc: Boston, USA

Post 3+ Months Ago

Its working on my side.
You can use the div as suggested, I use it quite often.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8413
  • Loc: USA

Post 3+ Months Ago

webcosmo wrote:
Its working on my side.
You can use the div as suggested, I use it quite often.

I know you can do that, and I know it would work. I just don't think that is a good idea.
  • UPSGuy
  • Lurker ಠ_ಠ
  • Web Master
  • User avatar
  • Posts: 2733
  • Loc: Nashville, TN

Post 3+ Months Ago

I don't see any immediate reason for concern. I've used it myself quite a few times with a stretched background to achieve the same effect.
  • joebert
  • Fart Bubbles
  • Genius
  • User avatar
  • Posts: 13504
  • Loc: Florida

Post 3+ Months Ago

I haven't used <hr/> in awhile. I generally have content that would need an <hr/> to separate it inside containers, and I just apply the visual separation of an <hr/> with that containers CSS.

I'm inclined to agree with bogey about jury-rigging something else for the sole purpose of working like something that already exists though.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8413
  • Loc: USA

Post 3+ Months Ago

joebert wrote:
I haven't used <hr/> in awhile. I generally have content that would need an <hr/> to separate it inside containers, and I just apply the visual separation of an <hr/> with that containers CSS.

That's what I do. I put the line within the div/element.

Like if you visit my site, you will see a yellow line after 'Welcome to Wedevoy!'.

That is accomplished like:

The HTML
Code: [ Select ]
<h1>Welcome to Wedevoy!</h1>
The CSS
Code: [ Select ]
h1 {
    color: #798030;
    padding-left: 25px;
    padding-bottom: 5px;
    border-bottom: 2px solid #C3CC4D;
}
  1. h1 {
  2.     color: #798030;
  3.     padding-left: 25px;
  4.     padding-bottom: 5px;
  5.     border-bottom: 2px solid #C3CC4D;
  6. }
  • NickN
  • Novice
  • Novice
  • NickN
  • Posts: 17

Post 3+ Months Ago

Found it!

Stupid actually. Since it works in Mozilla and not in IE8 it had to be the CSS-file:

Code: [ Select ]
1.hr { color: #B4C0CF; background-color: #B4C0CF; border: 0px solid #B4C0CF; }


--> the border had to be 1px minimum, though Mozilla showed it.

---------

Personally I think the <div> tag is easy and multifunctional, but it doesn't always pass the HTML validator of W3C. It's "better" to use the standard tags, and adjust them with CSS I think. But then you have to pay attention, so you don't get mistakes like these :-)
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8413
  • Loc: USA

Post 3+ Months Ago

tastysite wrote:
I gave up on the <hr /> tag a long time ago just use a div with a background and set it to tile along (x)

Also, one other reason not to do that... no reason to invent the wheel, and find a hack (or a fix) to something that already works.

Not need to fix something that isn't broken.

It's also easier to put <hr /> instead of <div></div> or <span></span>.
  • mk27
  • Proficient
  • Proficient
  • User avatar
  • Posts: 334

Post 3+ Months Ago

Bogey wrote:
webcosmo wrote:
Its working on my side.
You can use the div as suggested, I use it quite often.

I know you can do that, and I know it would work. I just don't think that is a good idea.


I agree in the sense that if "deprecating" <hr> means having to get this silly just to get a horizontal rule in a page, that is "devolution". Nothing is improved by requiring more coding instead of less in such a simple case; I think the IE8 and WC3 people responsible should now have to spend their evenings and weekends "updating" all the pages on the net containing <hr> -- and never, ever be allowed any input into major software development again... :mrgreen:
  • marksmithweb
  • Born
  • Born
  • marksmithweb
  • Posts: 1

Post 3+ Months Ago

But I still use <hr /> without any problems can u show your website so we can have a look?
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8413
  • Loc: USA

Post 3+ Months Ago

marksmithweb wrote:
But I still use <hr /> without any problems can u show your website so we can have a look?
I think he fixed his problem...

Post Information

  • Total Posts in this topic: 15 posts
  • Users browsing this forum: No registered users and 49 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.