Help - Search - Members - Calendar
Full Version: Using image as an HR
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
Terminator
I have to use an image as an HR for a class project, but I cant get it to work.

Cant I just style it like this?

CODE

hr {
     background: url(img/hr.png) repeat-x;
    clear: both;
}


I am using this as an inline style for the page, but it does not display any image. The image code is right, and in correct folder but does not show up.

Don't I just put it on the HTML like below? I also tried making this as a DIV but that did not work

CODE

<hr />
Christian J
QUOTE(Terminator @ Dec 3 2015, 11:30 PM) *

I have to use an image as an HR for a class project

Maybe they simply meant an IMG element that looks like a horizontal rule? But then it's not the same thing as a HR, semantically speaking:
"The hr element represents a paragraph-level thematic break, e.g. a scene change in a story, or a transition to another topic within a section of a reference book."
http://www.w3.org/TR/2014/REC-html5-201410...#the-hr-element



QUOTE
Cant I just style it like this?

Maybe the HR needs a little height also, so the image shows up inside it? Normally it's just the HR border you see, with no space for the image in between.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2019 Invision Power Services, Inc.