Header Nav problem/question

Permalink
hi

iam building a new theme, using only DIVs, no tables this time:)
for now everything works fine.. except for the Header Nav background... i can not ad an image for the Header Nav background, this is the css code, for now for this area:
#Header Nav {
position: relative;
width: 100%;
height: 74px;
background-image: url(./images/title.jpg);
background-repeat:repeat-x;

}

nothing fancy
...but if i rename the editable area from Header Nav to anything else, the image is loaded fine...? what is going on with Header Nav?

rutrem
 
glockops replied on at Permalink Reply
glockops
Whoops Nav is an HTML5 tag :P
glockops replied on at Permalink Reply
glockops
When you say rename the editable region, what exactly are you doing?
rutrem replied on at Permalink Reply
rutrem
for ex.if iam changing name of the Header Nav in HeadTest in .default.php and main.css files... after that the background image works.

...so how i have to format the background propriety tag inside my Header Nav {} CSS to let the Header Nav uses the background image?

thnx for ur time!
glockops replied on at Permalink Reply
glockops
Just to clarify, you are using HTML5 tags, correct?

If so,
Try removing the # in from of Header if you're using the <header> tag.

Also, it's possible the browser you are using is not recognizing HTML5 tags - are you using something like the HTML5 Boilerplate (http://h5bp.com) or Modernizr?
rutrem replied on at Permalink Reply 2 Attachments
rutrem
if i remove # from Header Nav or any other editable area name in the CSS, the background images disappears.

i have attached the main.css and default.php files from my theme

iam useing Firefox 12.0 version.
rutrem replied on at Permalink Reply
rutrem
i dont use Boilerpate or Modernizer
glockops replied on at Permalink Best Answer Reply
glockops
An id with two words is not valid HTML, and is the reason your CSS isn't working. Additionally, you cannot reused an ID on a page. I imagine when you do get it working you're using a single word.

Change the div with "Header Nav" so it removes the word header or has no spaces. Here's an example
<div id="header">
 ...
</div>
<div id="nav">
 ...
</div>


Then in your CSS just reference #nav
#nav {
 .. your styles here
}


That should get you working.
rutrem replied on at Permalink Reply
rutrem
thnx a lot... works well
i am feeling so stupid now :)
space between 2 words..mmmm ! :-/