2 replies [Last post]
Hillbilly
Offline
Regular
Tigard, OR
Last seen: 15 years 32 weeks ago
Tigard, OR
Joined: 2007-05-09
Posts: 17
Points: 0

Hello,
It appears to me my first div in the body doesn't seem to take its ID attributes from my CSS file. I have tried moving other divs to the top in hopes of seeing that it was a section of bad code in my CSS, but this resulted in the same effect. At this time I have been placing a blank set of divs to fix the issue temporarily.

The actual site at this time is based out of Black Sierra

My HTML file.


BSP - Black Sierra Productions






No.25 Flashbang













My CSS file.
/* CSS Document */

/* General Styles */

body {
background: #ffffff;
font-family:Arial, Helvetica, sans-serif;
font-size: 10px;
color: #333333;
margin: 0;
padding: 0;
}

img {
border: 0;
}

a {
color:#850606;
border: 0;
text-decoration: none;
}

a:hover {
color:#850606;
text-decoration: underline;
}

/* Admin */

#admin {
height: 14px;
width: 800px;
margin-left: auto;
margin-right: auto;
}

#admin div {
margin: auto;
}

#adminbar {
width: 169px;
height: 14px;
margin: auto;
background-image:url(../images/admin_bg.gif);
float: right;
}

.flash {
float: left;
}

.soldier {
float: right;
}

/* Header of BSP - Black Sierra Productions */

/* Logo Bar */

#header {
height: 85px;
width: 800px;
margin-left: auto;
margin-right: auto;
}

#header div {
width: 800px;
margin: auto;
}

.logo {
float: left;
}

.v1 {
float: right;
}

/* Navigation */

#nav {
background-image:url(../images/nav_bg.gif);
height: 14px;
width: 800px;
margin: auto;
}

#nav div {
width: 800px;
margin: auto;
}

/* Admin Navigation Rollovers */

#adminnav {
width: 133px;
height: 14px;
background: url(../images/admin.gif);
margin: auto;
padding: 0;
position: relative;
}

#adminnav li {
margin: 0;
padding: 0;
list-style: none;
position: absolute;
top: 0;
}

#adminnav li, #adminnav a {
height: 14px;
display: block;
}

#menumember {left: 0; width: 72px;}
#menuadmin {left: 72px; width: 61px;}

#menumember a:hover {
background: transparent url(../images/admin.gif)
0 -14px no-repeat;}
#menuadmin a:hover {
background: transparent url(../images/admin.gif)
-72px -14px no-repeat;}

/* Navigation Rollovers */

#mainnav {
width: 478px;
height: 14px;
background: url(../images/nav.gif);
margin: auto;
padding: 0;
position: relative;
float: left;
}

#mainnav li {
margin: 0;
padding: 0;
list-style: none;
position: absolute;
top: 0;
}

#mainnav li, #mainnav a {
height: 14px;
display: block;
}

#menuhome {left: 0; width: 57px;}
#menuabout {left: 57px; width: 73px;}
#menucommun {left: 130px; width: 85px;}
#menuevents {left: 215px; width: 64px;}
#menumedia {left: 279px; width: 61px;}
#menutrain {left: 340px; width: 68px;}
#menututor {left: 408px; width: 70px;}

#menuhome a:hover {
background: transparent url(../images/nav.gif)
0 -14px no-repeat;}
#menuabout a:hover {
background: transparent url(../images/nav.gif)
-57px -14px no-repeat;}
#menucommun a:hover {
background: transparent url(../images/nav.gif)
-130px -14px no-repeat;}
#menuevents a:hover {
background: transparent url(../images/nav.gif)
-215px -14px no-repeat;}
#menumedia a:hover {
background: transparent url(../images/nav.gif)
-279px -14px no-repeat;}
#menutrain a:hover {
background: transparent url(../images/nav.gif)
-340px -14px no-repeat;}
#menututor a:hover {
background: transparent url(../images/nav.gif)
-408px -14px no-repeat;}

Any help or suggestions would be appreciated at this point. I am very new to the coding aspect of web design and have been learning how this is all done as I go. Thanks.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 8 years 4 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

An ID may only be used once

An ID may only be used once per page, if you need to repeat a set of rules then use classes.

If you have the html-tidy extension for Firefox installed then you will get a constant validation check on your code which would have highlighted the error.

Checking your code for syntax errors is important as these will cause problems but are easily resolved (look at your attribute quotes in the link tag)

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Hillbilly
Offline
Regular
Tigard, OR
Last seen: 15 years 32 weeks ago
Tigard, OR
Joined: 2007-05-09
Posts: 17
Points: 0

Thanks

Thanks Hugo for your references. I found out I was missing a " in my at the end of "all". That was what was casuing the problem, this solved my display errors in IE that were not mentioned. Its hard to believe one little error can actually make a document freak out so much.

Once again, thanks.