- This topic is empty.
-
AuthorPosts
-
September 16, 2008 at 7:36 pm #23269LuisMember
Hey guys;
I’m having problems with positioning of the elements. It looks good in IE but, the positioning in firefox is wrong.
As you can see below there gap between the divs, I can fix one browser then the other browser has the same
problem.Sorry the site is not live yet, so attach the code in image so you can see.
Thanks
here is my CSS Code:
Code:body{
background-color: #000;
}#driver{
color: white;
position:relative;
left:125px;
top: 55px;}
#store{
color: white;
position:relative;
left:450px;
top: 10px;
}#data{
color: white;
position:relative;
left:690px;
top: -35px;
}#header{
background-image:url(images/header.png);
width: 840px;
height: 300px;
position: relative;
top: 0px;
clear:both;
}#page-wrap1{
width: 840px;
margin: 0 auto;
}#subnav{
background-image:url(images/subnav.png);
width: 840px;
height: 150px;
position: relative;
top: 0px;
}/* Reset*/
ul {list-style: none inside;}
p { font-size: 1.2em; line-height: 1.2em; margin-bottom: 1.2em; }
a { outline: none; color:#FB8000; text-decoration: none }
a:hover{ color: white;}
a img { border: none; }
.clear{ clear:both;}
/* END RESET */#nav{
height: 50px;}
#nav ul{
list-style: none;
}#nav ul li {
display: inline;
}#nav ul li a {
height: 50px;
float: left;
padding: 0px 0px 0px -50px;
text-indent: -9999px;
position:relative;
left:-40px;
}#nav ul li a.home{
width: 120px;
background: url(images/nav-home.png) center bottom no-repeat;
float: left;
}#nav ul li a.about {
width: 120px;
background: url(images/nav-about.png) center bottom no-repeat;
}#nav ul li a.services {
width: 120px;
background: url(images/nav-services.png) center bottom no-repeat;
}#nav ul li a.store {
width: 120px;
background: url(images/nav-store.png) center bottom no-repeat;
}#nav ul li a.download {
width: 120px;
background: url(images/nav-download.png) center bottom no-repeat;
}#nav ul li a.testimonials {
width: 120px;
background: url(images/nav-testimonials.png) center bottom no-repeat;
}#nav ul li a.contact {
width: 120px;
background: url(images/nav-contact.png) center bottom no-repeat;
position: relative;
left: 680px;
top: -50px;
}#nav ul li a:hover {
background-position: center center;
}body#home #nav ul li a.home,
body#about #nav ul li a.about,
body#services #nav ul li a.services,
body#store #nav ul li a.store
body#download #nav ul li a.download
body#testimonials #nav ul li a.testimonials
body#contact #nav ul li a.contact{
background-position: center top;
}Here is my HTML Code
Code:
ADP Computer “Your Source for Solutions”
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.