Problem with linked style sheet

**ddeile** · Aug 13, 2001, 20:33

Hi,

I'm in the process of designing a site around css. Got a problem though. When the style sheet is embedded, everthing displays correctly. When I link the sheet either using <ling rel> or @import i get a few display errors.

1. Top area of page is black and is supposed to span 100% of the screen.

2. The scrollbar color changes do not appear.

3. The text (<p>) is being space correctly but the primary font is not being displayed.

Here are both test page urls:

http://www.electrofiction.com/ultra.html (link style sheet)

http://www.electrofiction.com/ultra2.html (embeded sheet)

Also here is my style sheet:

<style type="text/css">

body {
margin:0px 0px 0px 0px;
padding:0px;
font-family:verdana, arial, helvetica, sans-serif;
color:#333;
background-color:#ffffff;
scrollbar-face-color: #B7C1CE;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #eee;
scrollbar-arrow-color: #FF9900;
}

#top {
position:absolute;
top:0px;
left:0px;
right:0px;
width:100%;
height:200px;
background:#000000;
border-bottom:5px solid #718393;
}

#nav {
position:absolute;
top:180px;
left:0px;
right:0px;
width:100%;
height:20px;
background:#000000;
}
#grey {
position:absolute;
top:200px;
left:0px;
right:0px;
width:100%;
height:5px;
background:#687787;
}

#conleft {

position:absolute;
top:225px;
left:20px;
width:230px;
background:#ffffff;
margin-right:8px;
padding-bottom:20px;
padding-left:25px;
padding-right:20px;
}

#conright {

position:absolute;
top:225px;
left:275px;
width:425px;
background:#ffffff;
margin-right:8px;
padding-bottom:20px;
padding-left:25px;
padding-right:20px;
}

P.rightside {
text-align:left;
}

p,h1,pre {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}

h1 {
font-size:12px;
font-weight:700;
padding-top:0px;
color: #718393;
border-bottom:1px solid #718393;
border-top:0px solid #718393;
border-left:0px solid #718393;
border-right:0px solid #718393;
}

h2 {
font-size:12px;
font-weight:700;
padding-top:10px;
color: #B7C1Cg;
}
a {
color:#09c;
font-size:11px;
text-decoration:none;
font-weight:400;
font-family:verdana, arial, helvetica, sans-serif;
}
a:link {color:#FF9900;}
a:visited {color:#FF9900;}
a:hover {background-color:#eee;}

#rightcontent p {
font-size:10px;
margin-left:0px;
}

.logo {position:absolute; top:100px; left:270px; }
.nav {
position:absolute;
top:134px; left:315px;
}

</style>

Any help is apreciated. Thanks.

**duckie** · Aug 13, 2001, 21:06

Your site seems to be down at the moment, but try taking out <style type="text/css"> and </style> from your linked CSS file.

**neil** · Aug 13, 2001, 21:09

I can't connect onto that server.

Have you got the below inbetween the <head> tags?
<link rel="stylesheet" href="thename.css" type="text/css">

** Change thename to whatever you called the stylesheet and be sure to have it in the correct directory.

Also in your stylesheet leave out the <style type="text/css"> and </style>.

**duckie** · Aug 13, 2001, 21:12

Hey neil the Chinese Proverbs on your site is pretty interesting, I used to learn them in school.

Some just don't seem to translate properly though, and there are a few I've never seen.

**ddeile** · Aug 13, 2001, 21:33

Thanks Duckie, your advice worked.

The SitePoint Forums have moved.

User Tag List

Thread: Problem with linked style sheet

Thread Tools

Display

Problem with linked style sheet

Bookmarks

Bookmarks

Posting Permissions