CSS Beginner - External Style sheet- HELP

Dev Shed Forums Sponsor:

February 22nd, 2013, 12:02 PM

shinju

Registered User

Join Date: Feb 2013

Posts: 9

Time spent in forums: 2 h 30 m 50 sec
Reputation Power: 0

CSS Beginner - External Style sheet- HELP

Hi;

Is the first time that I am using CSS and I am trying to create an external style sheet but is not working. I have look videos, tutorials, manuals and I don’t see why is not working. My Html page don't grab the style of my style sheet.

This is my style sheet:

Code:

*{padding:5; margin:0;}
a{text-decoration:none;}

.main {width: 700px; margin-left:auto; margin-right:auto;}

.header {background-color:#04B4AE}
.header h1 {color:black; line-height:80px; font-size: xx-large;}
.header img {float:left; height:70px; width:100px; padding: 5px; margin-right:20px}

.menu {background-color:#04B4AE}
.menu {margin: 0px; list-style-type:none; float: left; height:500px;}

.center {background-color:#380B61; color yellow;
		float:left; width:150px}
.center h1 { font-size:large;}
.center p{ text-align: justify;}
.center h2{font-style: italic; font-size:small;}

.footer {clear:left; background-color: #04B4AE; font-size: x-small;}

And this is my Html page:

Code:

<html>
<head> 

	<link rel="stylesheet" type="text/css" href="style1.css"/>

</head>
<body>

<div class="main">

		<div class="header">
		<img src="logo.jpg" alt="logo"/>
		<h1>HTML PAGE USING EXTERNAL CSS</h1>
		</div>
		
		<div class="menu">
		<li> <a href="index.html">Home</a> </li>
		<li> <a href="home.html">Rentals</a> </li>
		<li> <a href="home.html">Registration</a> </li>
		</div>
		
		<div class="center">
			<h1> HTML PAGE USING EXTERNAL CSS</h1>
			
		</div>
		
		<div>
		<h1> (c)me. </h1>
		</div>
	</div>	
</body>	
</html>

February 22nd, 2013, 07:35 PM

lysergic

Registered User

Join Date: Feb 2013

Posts: 2

Time spent in forums: 59 m
Reputation Power: 0

Works fine check your file path of the stylesheet.
I.e: style1.css is in /home/file/style.css
Make sure its linked to that directory.

Also good habit to use div ids instead of classes.
Classes can be used multiple times which is good for some things. an id can be used once.
Also get in the habit of ordering your styling a little neater because it will be easier to read.
Such as

Code:

.menu {
	margin: 0px; 
	list-style-type:none; 
	float: left; 
	height:500px;
	}

February 26th, 2013, 03:18 AM

soniarhode

Registered User

Join Date: Feb 2013

Location: Bhopal

Posts: 4

Time spent in forums: 1 h 25 m 33 sec
Reputation Power: 0

thanks

Thanks for your information.

February 26th, 2013, 06:41 PM

shinju

Registered User

Join Date: Feb 2013

Posts: 9

Time spent in forums: 2 h 30 m 50 sec
Reputation Power: 0

Quote:

Originally Posted by lysergic

Code:

.menu {
	margin: 0px; 
	list-style-type:none; 
	float: left; 
	height:500px;
	}

Thank You for your help

CSS Beginner - External Style sheet- HELP

Developer Shed Advertisers and Affiliates