I am just starting out using CSS and I am having an issues with my Divs moving on me in Firefox and IE. I basically have a Div with an image in it that slides up into my navigation bar, which is in another Div. Any insight would be great since I am so new to this! Thank you
Here is my code.
</head>
<body>
<div id="main">
<div class="container">
<div id="header">
<div id="logo">
<h1>Logo</h1>
<img src="images/bre_logo.png" name="logo" width="200" height="122" /></div>
<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contact</a></li>
</ul>
<div style="clear:both"></div>
<div id="sidebar">
<img src="images/house.jpg" />
</div><!--end sidebar-->
</div><!--end header -->
</div><!--end container -->
</div><!--end main -->
And here is my CSS:
/* CSS Document */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
img, ins, kbd, q, s, samp,
small, strike, strong,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*END RESET*/
body { font-family: Verdana, Arial, Helvetica, sans-serif;
background: #ffff99
}
#main {
background: url(images/bre_headerRepeat.gif) repeat-x;
}
.container {
width: 800px;
margin: 0 auto;
}
#logo h1 {
text-indent: -9999px;
}
ul#menu {
list-style: none;
}
ul#menu li a {
font-size: 13px;
color: #000000;
text-decoration: none;
}
ul#menu li {
padding: 4px 50px 4px 0px;
float: left;
}
#menu a:link { color: #000000; text-decoration: none;}
#menu a:visited { color: #000000; text-decoration: none;}
#menu a:active { color: #ff9933; text-decoration: none;}
#menu a:hover { color: #ff9933; text-decoration: underline;}