html - Placing links over an image -


I'm trying to create a navigation bar. There is an image in the background, and I am using text placeholder until I have the link resolved. I can not seem to reveal the text in the navigation bar, rather they insist on appearing in a list style.

An example: Enter image details here Gray Gradiented Bar is intended for navigation bar.

HTML:

  & lt; Div id = "pagewrapper" & gt; & Lt; Div id = "container" & gt; & Lt; Div id = "left" & gt; & Lt; / Div & gt; & Lt; Div id = "right" & gt; & Lt; / Div & gt; & Lt; Div id = "center" & gt; & Lt; Div id = "pagebanner" & gt; & Lt; Img src = "img / banner.png" / & gt; & Lt; / Div & gt; & Lt; Div id = "navibar" & gt; & Lt; Img src = "img / navibar.png" & gt; & Lt; Div class = "naviitems" & gt; Home & lt; / Div & gt; & Lt; Div class = "naviitems" & gt; PHolder1 & lt; / Div & gt; & Lt; Div class = "naviitems" & gt; PHolder2 & lt; / Div & gt; & Lt; Div class = "naviitems" & gt; PHolder3 & lt; / Div & gt; & Lt; Div class = "naviitems" & gt; Contact us & lt; / Div & gt; & Lt; / Img & gt; & Lt; / Div & gt; & Lt; Div id = "pagecontent" & gt; & Lt; H1 & gt; Oh no, I broke my elephant! & Lt; / H1> & Lt; P & gt; Wiggle and lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt;  

and related CSS:

  #container {margin: 0 auto; Width: 1017px; Text-align: center; } # Left {float: left; Width: 160px; Height: 900px; Background color: # D8D8D8; #Wright (float: right; width: 160px; height: 900px; background color: # D8D8D8;} #center {display: inline-block; margin: 0 auto; width: 697px;} #PaperBanner {display: inline- Block; margin: 0 auto; width: 697 px;} # nvbar {display: inline-block; margin: 0 auto; width: 697 px; height: 27px;} .naviitems {margin: 0 auto; height: 25px; width : 20%; #pagecontent {display: inline-block; margin: 0 auto; width: 697px;}  

You can see the background of the parent DIV Instead of the image, instead of the image it is set to be called through an IMG tag.

  .navibar {background: url (URLofImage)}  

Comments

Popular posts from this blog

java - Can't add JTree to JPanel of a JInternalFrame -

javascript - data.match(var) not working it seems -

javascript - How can I pause a jQuery .each() loop, while waiting for user input? -