logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 10-28-2011, 03:47 PM   #1
katecher
 
Join Date: Jul 2008
Posts: 86
Default css style sheet won;t attach

Hello Everybody, I hope somebody can help me. A few days ago i created css style sheet, attached to my html file and everything worked fine. Today is layout stays perfectly fine in dreamweaver, but when i preview in browser i lost all my style. i don't understand what is going on?

Please can you help me??

Here is link to how my styles were not attached on server
http://www.katecher.com/dogs/index.html
here is code
<link rel="stylesheet" type="text/css" href="css/style.css"/>

and here is the image of my dreamweaver(screen shot)
http://www.katecher.com/dogs/test.html

and here is the code


@charset "UTF-8";


body {
margin: 0px;
padding: 0px;
background:#CF9 url(../pic/background.gif) fixed center;
}

#header_wrap {
width: 1024px;
height: 204px;
margin: 0px auto;

}

#header {
width: 1024px;
margin: 0 auto;
height: auto;
}

#menu_wrap {
width: 1024px;
height: 35px;
background:url(../pic/buttons/button.gif) repeat;
margin: 0px auto;
}


#menu {
width: 1024px;
height: 35px;
margin: 0 auto;
}


#menu ul {
margin: 0 0 0 25px;
padding: 0px;
list-style: none;
}


#menu li {
margin: 0px;
padding: 0px;
display: inline;
}

#menu a {
float:left;
display:block;
padding: 9px 0 0 0;
height: 35px;
width: 100px;
background: url(../pic/buttons/but.gif) no-repeat;
text-align: center;
font-size:16px;
text-decoration: none;
color:#e4f1cc;
font-family:Tahoma, Geneva, sans-serif;
outline: none;
a:visited { color: #993399
}
a:hover {
color: #330;
background-image: url(../pic/buttons/hover.gif);
background-repeat: no-repeat;
font-family: Tahoma, Geneva, sans-serif;
font-size: 16px;
text-align: center;
height: 35px;
width: 100px;
}
a:active {
color: #993333
}


#menu a:hover {
color: #330;
background-image: url(../pic/buttons/hover.gif);
background-repeat: no-repeat;
font-family: Tahoma, Geneva, sans-serif;
font-size: 16px;
text-align: center;
height: 35px;
width: 100px;
}

#menu .current {
color: #330;
background:url(../pic/buttons/hover.gif) no-repeat;
}

#content_wrap {
width: 1013px;
margin: 0 auto;
background-color: #666D43;
height: 980px;
padding: 5px;
}
#insidelongcolumn {
padding: 10px;
float: right;
}
#insideleft {
float: right;
width: 400px;
height: 180px;
background-image: url(../pic/welcome.gif);
padding: 10px;
background-repeat: no-repeat;
}
#nav {
background-color: #6E7948;
height: 150px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
#navcolumn {
float: left;
height: 120px;
width: 225px;
padding: 15px;
border-right-width: 1px;
border-right-style: ridge;
border-right-color: #9C6;
background-image: url(../pic/bgcolumnfoot.gif);
}
#footer {
background-color: #E5FAC3;
height: 25px;
width: 990px;
margin-right: auto;
margin-left: auto;
padding-left: 35px;
padding-top: 5px;
color: #333;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}

#content {
width: 1024px;
border: 1px solid #330;
background:#C96;
height: 1000px;
margin-right: auto;
margin-left: auto;
float: left;
}

#top {
width: 750px;
background-color: #E1EDBF;
height: auto;
float: left;
}

#topleft {
background:#306;
width:250px;
height: auto;
float: left;
}

#topcenter {
background:#690;
width:250px;
height: auto;
float: left;
}

#topright {
background:#030;
width:250px;
height: auto;
float: left;
}
#rightcolumn {
background-color: #959F6B;
float: right;
height: 925px;
width: 250px;
padding-left: 8px;
border: 1px solid #330;
}
column1 {
float: left;
background-color: #693;
height: 200px;
width: 200px;
}
#bottom {
background-color: #E5FAC3;
width: 750px;
height: 670px;
float: left;
}
#longunder {
background-color: #626C3E;
height: 140px;
width: 750px;
float: left;
background-repeat: repeat;
padding: 0px;
background-image: url(../pic/breedsbg.gif);
}
#smbox {
background-color: #E5FAC3;
height: 100px;
width: 165px;
float: left;
padding: 5px;
}
#breeds {
background-color: #CC9;
height: 300px;
width: 230px;
overflow: scroll;
padding: 0px 0px 0px 9px;
}
h6 {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #330;
}
#smboxspace {
background-color: #606D3B;
float: left;
height: 100px;
width: 10px;
}
#bottom_column {
float: left;
width: 335px;
height: 132px;
border-top-width: 1px;
border-right-width: 1px;
border-left-width: 1px;
border-top-color: #9C0;
padding: 10px;
margin: 0px;
border-right-color: #8BCF00;
border-left-color: #8BCF00;
border-right-style: solid;
background-color: #E9F9C6;
border-top-style: double;
border-left-style: solid;
}
#longcolumn {
background-color: #E0FBC0;
width: 720px;
padding: 15px;
height: 200px;
}
#bcspace {
background-color: #E5FAC3;
float: left;
height: 132px;
width: 10px;
padding: 0px;
}
#breedsabove {
color: #FFF;
width: 220px;
height: 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
padding: 7px;
text-align: center;
background-image: url(../pic/sign.gif);
background-repeat: repeat-x;
}
#localparks {
height: 30px;
width: 215px;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #000;
padding: 10px;
text-align: center;
background-repeat: repeat-x;
background-image: url(../pic/breedsbg.gif);
}
#names {
padding: 9px;
height: 120px;
width: 210px;
border-top-style: 8;
border-right-style: 8;
border-bottom-style: 8;
border-left-style: 8;
background-color: #EAFAC6;
}
#submitpic {
height: 25px;
width: 220px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
color: #FFF;
padding: 9px;
border: 1px solid #603;
text-align: center;
background-image: url(../pic/sign.gif);
}
#search {
background-color: #660;
height: 30px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
#searchleft {
background-color: #C93;
width: 512px;
float: left;
}
#searchlefthalf {
width: 250px;
background-color: #9EC4EA;
float: left;
height: 20px;
background-image: url(../pic/breedsbg.gif);
color: #600;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
padding: 5px;
}
katecher is offline   Reply With Quote
Old 10-28-2011, 05:47 PM   #2
dbepp
dbepp's Avatar
 
Join Date: Jun 2011
Location: Indiana
Posts: 93
Default

What happens when you place the css directly in the html document? Did you design the style sheet separately or move it when finished?
dbepp is offline   Reply With Quote
Old 10-28-2011, 06:33 PM   #3
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

The page loads the stylesheet just fine.

A quick look and I see the references in your CSS file to your images are wrong.

For example:
http://www.katecher.com/dogs/css/pic/buttons/button.gif

This image does not exist. Fix your paths, or upload the images to the right locations.
domedia is offline   Reply With Quote
Old 10-28-2011, 06:36 PM   #4
katecher
 
Join Date: Jul 2008
Posts: 86
Default

I created separately and attached to html.
I just added directly to html and nothing happened. have no clue what is going on.

here is the partial code

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>DogsTrail</title>
<style type="text/css">
@charset "UTF-8";


body {
margin: 0px;
padding: 0px;
background:#CF9 url(../pic/background.gif) no-repeat fixed;
}

#header_wrap {
width: 1024px;
height: 204px;
margin: 0px auto;

}

#header {
width: 1024px;
margin: 0 auto;
height: auto;
}



blah blah blah(didn't put the whole thing)

</style>
katecher is offline   Reply With Quote
Old 10-28-2011, 06:59 PM   #5
katecher
 
Join Date: Jul 2008
Posts: 86
Default

not sure what do you mean, I have all images attached. if images will be missed then it will be just boxes with an x in the middle. i missing styles themselves.

i just started new css styling sheet on completely different html and so far everything is ok. i just want to figure out what i did wrong. maybe i am attaching in the wrong place, can'tfigure this out.
katecher is offline   Reply With Quote
Old 10-28-2011, 08:12 PM   #6
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Quote:
Originally Posted by katecher View Post
not sure what do you mean, I have all images attached. if images will be missed then it will be just boxes with an x in the middle. i missing styles themselves.
No, images that are called in the stylesheet will not show a box with an x (in IE), they will simply not show up. Above, I showed you a reference to an image that is not right.
domedia is offline   Reply With Quote
Old 10-28-2011, 08:13 PM   #7
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Quote:
Originally Posted by dbepp View Post
What happens when you place the css directly in the html document?
Stylesheets belong in separate CSS files.
domedia is offline   Reply With Quote
Old 11-01-2011, 11:48 PM   #8
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

While it's best to have your CSS in a separate file, if you do put them in the html file you don't need "@charset "UTF-8";"

Here's an example:

<style type="text/css">
.test {
font-size: 10px;
}
</style>
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 07:08 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com