|
CSS - Css Menu Help - Bg Background Colour
Hey Guys,
I have validated both my html and css. The only errors that come back for my css is that I have the same colour background and whatnot. BUT that's what I want. So there aren't really errors. Here is my page: jacenta.com/whichsbc What I have been attempting to achieve and been utterly failing is: If you goto the menu on the side and hover over you will see a light grey background show up. Basically I want that to extend to ethier ends of the box. Is there anyway for this to be done??? I've tried everything and I just can't seem to figure this one out. A good example of what I am looking for is in my drop down menu at the top when you select a heading and a dropdown comes down, hover over an item and a light blue background will show up. It's probally something simple... I know. But ahh. It's just so frusterating! If someone could help me out I would apperciate it so much! You all are such a great help. - Jacenta Similar TutorialsHi all, the page i am talking about is... http://sydneynightowl.com.au/home.php The problem is the the div 3column seems to start too early in the work flow and also the background colour on the header bleeds. The div and header should be starting after the first 3 divs (which are set to float) I hope i have explain this correctly, any help is apriciated. The css code is Code: @charset "utf-8";
/* CSS Document */
body {background-color:#000000;
background-image: url(../images/background.jpg);
background-repeat:no-repeat;
background-position:center top;
color:#FFFFFF;
font-family:"Lucida Sans Unicode", sans-serif;
font-weight:100;
font-size:12px;}
#container {
position:absolute;
width: 700px;
left:50%;
margin-left:-358px;
}
#header {
margin-top:0px;
height: 115px;}
#toolbar {height: 30px;
line-height:10px;
padding: 0px 10px;
font-variant:small-caps;
}
#cornerlogo {
position:fixed;
top:5px;
left:5px;
}
#topnavigation {height: 35px;
line-height:35px;
text-align:center;}
#content { border-bottom:1px;}
.3column {width:695px;
padding-right:5px;
padding-left:5px;
margin-top:5px;}
#leftcolumngl {float:left;
width:223px;
height:370px;
padding-right:5px;
padding-left:5px;
padding-top:5px;
margin-top:15px;
margin-right:5px;
border:#FFFF00 solid thin;}
#middlecolumngl {float:left;
height:370px;
width:225px;}
#rightcolumngl {float:left;
height:370px;
width:230px;
padding-left:5px;}
#leftcolumn { float:left;
width:230px;
padding-right:5px;}
#middlecolumn {float:left;
width:230px;}
#rightcolumn {float:left;
width:230px;
padding-left:5px;}
#imagecolumn {float:left;
width:340px;
padding-left:5px;}
#infocolumn {float:left;
width:340px;
padding-left:5px;}
#footer {height: 30px;
border:thin solid #FFFFFF;
clear:both;
text-align:center;
margin-bottom:30px;
margin-top: 30px;
line-height:25px;}
#bgfirst {
position:absolute;
top:190px;
left:0px;
width:90%;
height:200px;
margin-bottom:20px;
background-color:#00CC00;
}
#bgsecond {position:absolute;
top: 400px;
right:0px;
width:90%;
height:200px;
background-color:#660066;
}
a:link {color: #fffc00; font-weight: normal;}
a:active {color: #fffc00; font-weight: normal;}
a:visited {color: #fffc00; font-weight: normal;}
a:hover {color: #fffc00; font-weight: bold;}
a.event:link {color: #fffc00; font-weight: normal;}
a.event:active {color: #fffc00; font-weight: normal;}
a.event:visited {color: #fffc00; font-weight: normal;}
a.event:hover {color: #fffc00; font-weight: bold;}
a.club:link {color: #fffc00; font-weight: normal;}
a.club:active {color: #fffc00; font-weight: normal;}
a.club:visited {color: #fffc00; font-weight: normal;}
a.club:hover {color: #fffc00; font-weight: bold;}
h1 { text-align:center;
color:#000000;
background-color:#fffc00;
margin-left:3px;
margin-right:3px;
font-variant:small-caps;
font-size:22px;}
h2 {text-align:center;
color:#fffc00;
background-color:#333333;
margin-left:3px;
margin-right:3px;
font-variant:small-caps;
font-size:18px;}
.ourprice {
display:inline;
color:#FF0000;
line-height:20px;
font-variant:small-caps;
font-size:14px;}
img {
border-color:#fffc00;
border-style:solid;
border-width:thin;
}
img.noborder { border:none;}
img.venues {float:left;
margin:10px;}
.mainnavimages {
border-color:#979700;
border-style:solid;
border-width:thin;
}
p {line-height:15px;}
strong { color:#fffc00;}
Is there a way to get it so that if images dont load, then it shows a background colour I tired using both colour an image, but it didn't work Code: background: url(images/background.png); background:#000000; The reason i'm asking is when i'm at college, i have images disabled, and because i used white text, i have to highlight the text in order to read it Is there a way to do this I have a FAQ web page which has a list of questions at the top which link to the answer for that question (on that page). I have used 'on click' to change the background colour of the div which contains the answer to the question you have clicked on. Code: <a href="#name" onclick="document.getElementById('namediv').style.background='#99ccaa'" >click here !!! </a><br>
And this works, but it becomes a problem when i scroll back to the questions and click on another one. It will change the background of the new div as required but I can't find a way to revert the previous div back to its original background color. any ideas? Thanks Hi there, I have a text field which I would like to change colour on hover. Any ideas how I would do this? I tried using a class with a:hover but it didn't work. Thanks! Hi there, I was wondering how I would go about creating input fields have a different colour background when teh user has clicked on it and ins typing. I tried using :active, bit it didn't work. Any ideas? I was wondering on this table I have I want it to have black background colour but I want to change the opacity to where you could see the background image too Hi all, I would be very grateful if someone could help me out with a coding problem. Basicaly, I have two columns and I want both to fill with the background colours with the same height. My sample coding is below. (NOTE: Ive had to remove the urls from the DOCTYPE and <html>, please replace with correct code). <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="w3.org/1999/xhtml" > <head><title>100% Height CSS Layout</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> #all{ WIDTH: 950px; PADDING-TOP:0px; MARGIN: 3px auto 0px; POSITION: relative; BACKGROUND-COLOR: #fff; FLOAT: left; } #leftside{ FLOAT:left; WIDTH:169px; MARGIN: 0px; PADDING: 0px; BORDER-RIGHT: 1px solid #999; POSITION: relative; BACKGROUND-COLOR: #ededed; } #rightside{ BORDER: 0px solid #000; WIDTH:775px; FLOAT:left; POSITION: relative; MARGIN: 0px 0px 0px 5px; BACKGROUND-COLOR: #F4CDD8; } </style> </head> <body> <div id="all"> <div id="leftside">a<br>b<br></div> <div id="rightside">c<br>d<br>e</div> <div> </body> </html> In the above example I would like the "leftside" div to stretch to the same height height as the "rightside" div filling the area up with the "leftside" background colour and also extending the 1px border. All help much appreciated. Thanks Soph Dear all, I have an iframe of variable width (width="100%") and a fixed height. Within the iframe I show multiple divs containing calendar appointments. Quite often, the number of divs that are side by side causes the iframe to scroll horizontally, which is fine, but when I scroll to the right I lose my background image and colour in the portion that wasnt visible when the page loads. If I reduce the screen size down, and refresh, then expand again, the area of the iframe that appears has a white blank background. Is there any way around this? Many thanks, Mark Can anyone tell me how to change the background colour of all tooltip texts on a web page? Cheers. I have customized the elements of a form for a website I am working on. I have set the input fields to have a white background, however, in three out of the six textfields the background is yellow (this only happens in Internet Explorer 6). I have checked the CSS, and the yellow isn't included anywhere. If anybody can help I would be grateful. Thanks. Essentially I'm creating a 'drop-up' menu without javascript. Here is my test page: http://38.99.165.179/kalle/cssmenu/index3.html PROBLEM: I am using 'float: left' to arrange my main menu items horizontally. With 'float: left' it seems like I lose control over the #menu_container background color. It's supposed to be a shade of red. If I delete 'float: left', I regain control over the container background, and the shade of red appears. Why is this happening? This problem doesn't seem to exist if I use 'display: inline' instead of 'float: left', to sort my main menu items horizontally. BUT 'display: inline' causes other issues, and so for various reasons I'd like to try to keep using float: left. Here is my code: Code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style>
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
background-color: #555555;
color: #EEEEEE;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#top {
width: 100%;
height: 80%;
text-align: center;
}
/* MENU BAR */
#menu_container {
width: 100%;
margin: 0 auto;
/* doesn't work!!! */
background-color: #CC6666;
}
#menu {
font-size: 16px;
}
#menu a {
text-decoration: none;
color: #FFFFFF;
}
#menu ul {
}
#menu li {
position: relative;
display: block;
height: 1.2em;
margin-right: 50px;
text-align: left;
/* PROBLEM */
/* With 'float: left', the background color disappears for #menu_container. */
/* Disable 'float: left' here, and you see what I mean. */
/* Why does this happen?
float: left;
/* The 'float: left' is needed to sort my main menu items horizontally. If I use the alternate way 'display: inline', then my drop-up menus don't automatically attach themselves to the correct spot. I want to avoid manually positioning them. */
}
#menu li ul {
background-color: #BBBBBB;
position: absolute;
bottom: 1.2em;
display: none;
list-style: none;
width: 110px;
padding: 0px;
}
#menu li:hover ul {
display: block;
white-space: nowrap;
}
#menu li:hover ul li {
display: block;
}
#menu li:hover ul li:hover {
background-color: #777777;
}
/* END - menu bar */
#bottom {
margin-top: 70px;
height: 150px;
text-align: center;
clear: both;
padding-top: 2px;
background-color: #222222;
}
</style>
</head>
<body>
<div id="top">
content
</div>
<div id="menu_container">
<ul id="menu">
<li><a href="#">Home</a>
<ul>
<li><a href="#">Anything</a></li>
<li><a href="#">Needed</a></li>
<li><a href="#">Here?</a></li>
</ul>
</li>
<li><a href="#">Something 1</a>
<ul>
<li><a href="#">Imagine</a></li>
<li><a href="#">the</a></li>
<li><a href="#">Possibilities</a></li>
<li><a href="#">of Magic!</a></li>
</ul>
</li>
<li><a href="#">Something 2</a>
<ul>
<li><a href="#">Taste</a></li>
<li><a href="#">the</a></li>
<li><a href="#">Sensation</a></li>
<li><a href="#">of the Bubbles</a></li>
<li><a href="#">on your Tongue!</a></li>
</ul>
</li>
<li><a href="#">Something 3</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div id="bottom">
content
</div>
</body>
</html>
Hi guys, Is it possible in CSS to change the colour / image of the page background dynamically. So that as you hovered over different links , the background of the page changed. I know you can do this in JS but how would you do it in CSS? I was kinda thinking something like: a.linkname:hover, a.linkname:focus body { background-color:#00FF00; } but thats just a guess and doesnt work lol. Many Thanks, Alvin. I would like the link colour to change and the background of the <li> to change as well. I can't figure out what CSS to use for it though. I have made bold and underlined the li I want to change on hover. Code: <li id="menuitem_2mainnav"> <a id="menulink_2mainnav" class="mainlevelmainnav" href="/example/index.php?option=com_content&view=article&id=1&Itemid=2">Meetings</a> <ul id="menulist_2mainnav"> <li id="menuitem_2_1mainnav"><a id="menulink_2_1mainnav" class="sublevelmainnav" href="/example/index.php?option=com_content&view=article&id=1&Itemid=14">TEST 1</a></li> <li id="menuitem_2_2mainnav"><a id="menulink_2_2mainnav" class="sublevelmainnav" href="/example/index.php?option=com_content&view=article&id=1&Itemid=15">TEST 2</a></li> <li id="menuitem_2_3mainnav"><a id="menulink_2_3mainnav" class="sublevelmainnav" href="/example/index.php?option=com_content&view=article&id=1&Itemid=16">TEST 3</a></li> <li id="menuitem_2_4mainnav"><a id="menulink_2_4mainnav" class="sublevelmainnav" href="/example/index.php?option=com_content&view=article&id=1&Itemid=17">TEST 4</a></li> </ul> </li> I have tried: Code: #menulist_2mainnav li:hover{ color:#000000 !important; }
But it doesn't change the links text colour. When you make a normal drop down menu in a form tag you get your text field and then that small grey box with the down arrow in it. Is it possible to change that grey colour to some other colour? Thanks. Hi. Really hoping someone can help me with this... I'll try and explain this as best I can(!) Basically I've got a page containing a block of 9 images, with each linking to a video clip. At the moment I've got the CSS coded so that whenever the mouse is hovered over the 'infobar' (at the bottom of each image) it goes from having a transparent background with black text to having a grey background with white text. What I'm trying to achieve is that same effect whenever the mouse is hovered over any part of the image and infobar. The live online link can be found at: www.markmcm.co.uk/test/test.html The CSS is as as follows: Code:
/*
* Page Stylesheet
*/
body {
font-family: Arial, Helvetica, sans-serif;
background-color: #eaeaea;
border:0; margin:0; padding:0;
height: 100%;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
#container {
margin-left: auto;
margin-right: auto;
min-height: 100%;
width: 936px;
}
* html #container {
height: 100%;
}
#content {
float:left;
position: relative;
height: 528px;
width: 936px;
z-index: 0;
}
.miniscreen1, .miniscreen2, .miniscreen3, .miniscreen4, .miniscreen5, .miniscreen6, .miniscreen7, .miniscreen8, .miniscreen9 {
position: absolute;
float: left;
display: block;
width: 312px;
height: 176px;
}
.miniscreen1 {
top: 0;
left: 0;
}
.miniscreen2 {
top:0;
left: 312px;
}
.miniscreen3 {
top: 0;
left: 624px;
}
.miniscreen4 {
left: 0;
top:176px;
}
.miniscreen5 {
left: 312px;
top:176px;
}
.miniscreen6 {
left: 624px;
top:176px;
}
.miniscreen7 {
left: 0;
top:352px;
}
.miniscreen8 {
left: 312px;
top:352px;
}
.miniscreen9 {
left: 624px;
top:352px;
}
.info {
height: 30px;
top:3px;
left: 40px;
width: 265px;
float: left;
position: absolute;
}
.infobar {
left:0px;
position: absolute;
top: 140px;
width: 312px;
height: 36px;
outline: none;
color:#000;
background: url("data/infobar.png") no-repeat 0 0;
z-index: 650;
}
.infobar:hover {
background-position: 0 -36px;
outline: none;
color:#fff;
}
#infobar span {
display: none;
outline: none;
}
.clip_title {
outline: none;
font-size: 85%;
font-weight: 700;
vertical-align: top;
text-align: left;
}
.clip_sub {
outline: none;
height: 13px;
font-size: 80%;
line-height: 13px;
font-weight: 700;
vertical-align: top;
text-align: left;
}
And the HTML is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Test Page</title> <meta name="description" content=" " /> <meta name="keywords" content=" " /> <meta name="generator" content=" " /> <link rel="stylesheet" type="text/css" href="page.css" media="screen" /> </head> <body> <div id="container"> <div id="content"> <span class="miniscreen1"> <a href="#"> <img src="img/clip1.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 1<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen2"> <a href="#"><img src="img/clip2.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 2<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen3"> <a href="#"><img src="img/clip3.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 3<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen4"> <a href="#"><img src="img/clip4.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 4<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen5"> <a href="#"><img src="img/clip5.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 5<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen6"> <a href="#"><img src="img/clip6.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 6<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen7"> <a href="#"><img src="img/clip7.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 7<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen8"> <a href="#"><img src="img/clip8.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 8<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> <span class="miniscreen9"> <a href="#"><img src="img/clip9.jpg" width="312" height="176" border="0"> <span class="infobar"><span class="info clip_title">Test Clip 9<br><span class="clip_sub">123 Productions</span></span></span></a> </span></span> </div> </div> </body> </html> There must be a better (and easier?) way to do this. Any help would be very-much appreciated - and save an old bloke from tearing too much of his hair out(!) Hi Hoping someone might be able to help me. I'm working on a site but i can't for the life of me figure out how to get the background color to show. They sent me the index page and the two css style sheets for it. I can get the menu to do anything i want except the red background bar to show up. Hope someone can point me in the right direction. Thanks in advance for any help MsKazza This is the menu on the index page Code: <div id="menu">
<ul>
<li class="active"><a href="index.html">home</a></li>
<li><a href="design.html">design</a></li>
<li><a href="printing.html">printing</a></li>
<li><a href="websites.html">websites</a></li>
<li><a href="marketing.html">marketing</a></li>
<li><a href="prepress.html">prepress</a></li>
<li><a href="contact.asp">contact</a></li>
<li><a href="clients.html">clients</a></li>
<li><a href="links.html">links</a></li>
<li><a href="login.html">login</a></li>
</ul>
</div>
this is the related css: Code: /* Menu */
#menu {
width: 802px;
height: 45px;
margin: 0 auto;
border-right: 1px solid #EDEBD5;
}
#menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
display: block;
float: left;
width: 79px;
height: 28px;
border-left: 1px solid #EDEBD5;
text-transform: lowercase;
text-decoration: none;
text-align: center;
font-size: 1.2em;
color: #FFFFFF;
vertical-align: middle;
font-family: Geneva, Arial, Helvetica, sans-serif;
padding-top: 15px;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
}
#menu a:hover {
background: #F7F7F4;
color: #990000;
}
#menu .active a {
color: #FFFFFF;
background-color: #600000;
}
Once again, Firefox displays my code correctly and IE does not. I wasn't going to bother working on it further if IE 7 displayed it correctly, but it does not either. Here's my menu. The HTML code is CMS generated, but I have taken out the links. http://www.jimandkris.com/menuoutput.html The problem is within the submenu background as shown he I found this fix on the PIE site, but it just made it worse, not better. Can anyone suggest an IE hack to me to fix this? I've tried everything, with no luck. It's pointing to the right address, the css is loading. Why does the image not appear? div#main_menu { float: left; clear: both; width: 100%; height: 73px; background-image: url (images/button-banner.png) no-repeat; } div#main_menu ul { float: left; list-style: none; margin: 0; padding: 0; } div#main_menu ul li { float: left; height: 73px; margin: 0 15px; } div#main_menu ul li a { color: #7A5A46; float: left; margin-top: 17px; text-decoration: none; text-align: center; HTML: <div id="main_menu"> <ul> <li><a class="" href="#">Menu<br/></a></li> <li><a class="" href="/ordering/">Ordering Info<br/></a></li> <li><a class="" href="/photos/">Photos<br/></a></li> <li><a class="" href="/blog/">Blog<br/></a></li> <li><a class="" href="/about/">About Me<br/></a></li> <li><a class="" href="/contact/">Contact Info<br/></a></li> } Hi: I am having some problems getting the background image of a drop-down menu to do what I want. The drop-down menus have different lengths, and I have a gradient image which I would like to have repeat across (repeat-x) but on the y-axis, I want it to be scaled to fit the menu height which differs from drop-down to drop-down. I have the following code in my CSS file. Code: transparent url(../images/style1/submenu_bg.png) repeat-x 0 bottom I cannot figure out how to have the image scale on the y-axis. Any assistance would be appreciated. I have a fairly simple page that is composes of a header and two cols. The left hand col is the menu which I would like to use with background images but these seem not to work. Any advice is appreciated. [Code] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "(URL address blocked: See forum rules)"> <html xmlns="(URL address blocked: See forum rules)"> <head> <!--Don't add anything above this line, you may change the DTD to match your page--> <title>Test Page</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <!--Uncomment the following line and remove the embedded style sheet if your style is external--> <style type="text/css"> body { min-width: 760px; margin: 0; padding: 0; text-align: center; } #wrapper { width: 720px; margin:0 auto; text-align: left; background-color: #CDCDCD; } #branding { width:720px; height:120px; } #content { width: 520px; float: right; } #mainNav { width: 180px; float: left; } ul { list-style: none; margin: 0; padding: 0; } /* =-=-=-=-=-=-=-[Menu Eight]-=-=-=-=-=-=-=- */ #menu8 { width: 200px; margin-top: 10px; } #menu8 li a { text-decoration: none; height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; } #menu8 li a:link, #menu8 li a:visited { color: #000000; font-weight: bold; display: block; background: url(images/menu8.gif); padding: 8px 0 0 20px; } #menu8 li a:hover { color: #257EB7; background: url(images/menu8.gif) 0 -32px; padding: 8px 0 0 25px; } #menu8 li a:active { color: #fff; background: url(images/menu8.gif) 0 -64px; padding: 8px 0 0 25px; } #footer { clear: both; width: 720px; background-color: #CDCDCD; border: 2px solid; } body{ background-color:#ffffff; } </style> </head> <body> <div id="wrapper"> <div id="branding"> <img border="0" src="images/Top Bar.gif" width="720" height="120" alt="Hawkesley Publishing Solutions"/> </div><!--End Branding--> <div id="content"> <p>Spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam.</p> <p>Spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam.</p> <p>Spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam.</p> <p>Spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam.</p> </div><!-- End of Content --> <div id="mainNav"> <div id="menu8"> <ul> <li><a href="home.php" title="Home"><b>Home</b></a></li> <li><a href="e-books.php" title="E-Books"><b>E-Books</b></a></li> <li><a href="e-learninig.php" title="E-Learing"><b>E-Learning</b></a></li> <li><a href="hoe.php" title="How To Books"><b>How To Books</b></a></li> <li><a href="about.php" title="About Us"><b>About Us</b></a></li> </ul> </div><!-- End menu8--> </div><!-- End of mainNav --> <div id="footer"> <p>spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam spam.</p> </div><!-- End Footer--> </div><!--End Wrapper--> </body> </html> [Code] |
|||||||