anyone good with adobe dreamweaver?

da_illest101

Well-known member
I'm trying to make an external style sheet but it's just not working
so far I have this in the style sheet

@charset "utf-8";
/* CSS Document */
<style type="text/css">
.container {
background-image: url(background3.jpg);
margin: auto;
height: 480px;
width: 720px;
}
.topleft {
float: left;
height: 171px;
width: 520px;
margin-top: 62px;
margin-left: 80px;
}
.insideleft {
float: left;
height: 171px;
width: 150px;
}
.insideright {
height: 171px;
width: 350px;
margin-left: 170px;
}
.table {
height: 25px;
width: 460px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 250px;
padding-right: 0px;
padding-left: 0px;
padding-top: 295px;
}
.container .table table tr td {
font-family: Georgia, Times New Roman, Times, serif;
}
body,td,th {
color: #FFF;
}
</style>

but when I attach it to an html page nothing happens ::(:
I have no idea what i'm doing wrong
 

da_illest101

Well-known member
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.container {
background-image: url(background3.jpg);
margin: auto;
height: 480px;
width: 720px;
}
.topleft {
float: left;
height: 171px;
width: 520px;
margin-top: 62px;
margin-left: 80px;
}
.insideleft {
float: left;
height: 171px;
width: 150px;
}
.insideright {
height: 171px;
width: 350px;
margin-left: 170px;
}
.table {
height: 25px;
width: 460px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 250px;
padding-right: 0px;
padding-left: 0px;
padding-top: 295px;
}
.container .table table tr td {
font-family: Georgia, Times New Roman, Times, serif;
}
body,td,th {
color: #FFF;
}
</style>
</head>

<body>
<div class="container">
<div class="topleft">
<div class="insideleft">Content for class "topleft" Goes Here</div>
<div class="insideright">Content for class "insideright" Goes Here</div>
</div>
<div class="table">
<table width="460" border="0">
<tr>
<td>OWNER</td>
<td>CATALOGUE</td>
<td>STORE</td>
<td><div align="left">CONTACT</div></td>
<td>QUESTIONS</td>
</tr>
</table>
</div>
</div>
</body>
</html>
 

da_illest101

Well-known member
I copy the codes from that html page into the style sheet, though i tried to link it to that page


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="layout.css" rel="stylesheet" type="text/css" />
</head>

<body>
</body>
</html>
 
And you say it does nothing?

That file right there works for me in Firefox, with all the spacing and everything, except that I'm lacking whatever background image you're trying to use.
 

Nyoron

Member
if you're copying it to an external style sheet, you need to remove the inline tags (<style> and </style>):

Code:
.container {
background-image: url(background3.jpg);
margin: auto;
height: 480px;
width: 720px;
}
.topleft {
float: left;
height: 171px;
width: 520px;
margin-top: 62px;
margin-left: 80px;
}
.insideleft {
float: left;
height: 171px;
width: 150px;
}
.insideright {
height: 171px;
width: 350px;
margin-left: 170px;
}
.table {
height: 25px;
width: 460px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 250px;
padding-right: 0px;
padding-left: 0px;
padding-top: 295px;
}
.container .table table tr td {
font-family: Georgia, Times New Roman, Times, serif;
}
body,td,th {
color: #FFF;
}

it needs to be placed in "layout.css" in the same directory as that html file, of course :)
 

da_illest101

Well-known member
I did everything you both said and still nothing is happening. the page is still blank, I tried in google chrome and firefox, still the same
 
This is exactly what I have in the CSS file:

.container {
background-image: url(background3.jpg);
margin: auto;
height: 480px;
width: 720px;
}
.topleft {
float: left;
height: 171px;
width: 520px;
margin-top: 62px;
margin-left: 80px;
}
.insideleft {
float: left;
height: 171px;
width: 150px;
}
.insideright {
height: 171px;
width: 350px;
margin-left: 170px;
}
.table {
height: 25px;
width: 460px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 250px;
padding-right: 0px;
padding-left: 0px;
padding-top: 295px;
}
.container .table table tr td {
font-family: Georgia, Times New Roman, Times, serif;
}
body,td,th {
color: #000;
}
 

da_illest101

Well-known member
still not working, I tried one of my previous css from last year and it work. I copy paste the codes from my current style and nothing again. Thanks for trying, I aprreciate. I'll just copy paste the html code into my other pages and ask my teacher tommorow
 
Top