Jump to content

CSS problem


bjgrooven

Recommended Posts

I have just begun developing a web page for the first time. I am trying to apply my CSS that I have written to my page, but it doesnt work in firefox and comes up all funky in IE. I have gone through the tutorial and am still dumbfounded! Am I linking the CSS to the html wrong? Have I written the CSS wrong? Any help would be appreciated!HTML:

<html><head><link rel="stylesheet" type="text/css" href="css/NSCS.css"/><title>NSCS_University of Colorado at Boulder</title></head><body><div id="header1"><h1>Welsome to NSCS<br>in Boulder!<h1><br><p>The Home of Leadership, Scholarship, and Service<p></div><div id="thumb"></div><div id="content"><h2>Welcome<h2><p>This is a preliminary model and will soon be up on the real web!<p></div><div id="officers"><h1>Chapter Officers<h1><p> <P> <ul><li><b>Jocelyn Liipfert, <I>Co-Executive President</I></b><BR><a href="mailto:jocelyn.liipfert@colorado.edu">Jocelyn.Liipfert@colorado.edu</a><LI><b>Ashley Sullivan, <I>Co-Executive President</I></b><BR><a href="mailto:Ashley.Sullivan@colorado.edu">Ashley.Sullivan@colorado.edu</a><LI><b>Adam Schuckman, <I>V.P. Public Relations/Treasurer</I></b><BR><a href="mailto:adam.schuckman@colorado.edu">Adam.Schuckman@colorado.edu</a><LI><b>Greg Goeken, <I>PFCS</I></b><BR><a href="mailto:gregory.goeken@colorado.edu">Gregory.Goekin@colorado.edu</a><LI><b>Nick Newsum, <I>PFCS</I></b><BR><a href="mailto:nicholas.newsum@colorado.edu">Nicholas.Newsum@colorado.edu</a><LI><b>Leigh Murdock, <I>Coordinator</I></b><BR><a href="mailto:leigh.murdock@colorado.edu">Leigh.Murdock@colorado.edu</a><LI><b>BenHaugen, <I>Historian/Technology Facilitator</I></b><BR><a href="mailto:benjamin.haugen@colorado.edu">Benjamin.Haugen@colorado.edu</a></li></ul></div>    </font>CSS:

body { margin:0px; padding:0px; font:12px serif; font-family:serif; color:#000000; }h1 { margin:0px 0px 0px 0px; padding:0px 0px 0px 5px; font-size:18px; font-style:bold,"times new roman",underline; font-family:sans-serif; color:black; }h2 { margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; font-size:14px; font-family:serif; color:#000000; } #header1 { position:absolute; top:0px left:0px height:152px; width:567px; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; border-style:solid; border-color:black; border-width:0px 3px 3px 0px; background-color:#FEC721; } etc, etc, etc...Thanks for the help!Ben

Link to comment
Share on other sites

Here is my modified html and css docs. The page works just fine in IE but the image doesnt load in Firfox, nor do the rest of my styles work. Are there special characteristics of Firefox that I am missing? The css style link is the exact same format as that of a page I know works in Firefox, so that cant be the problem. Here are the new css and html.[/code]<html><head><style type="text/css" media="all">@import url("css/NSCS.css");</style><title>NSCS_University of Colorado at Boulder</title></head><body><div id="header1"><h1>Welcome to NSCS<br>in Boulder!</h1><br><h2>The Home of Leadership, Scholarship, and Service</h2></div><div id="thumb"></div><div id="content"><h2>Welcome</h2><p>This is a preliminary model and will soon be up on the real web!</p></div><div id="officers"><h1>Chapter Officers</h1><ul><li><b>Jocelyn Liipfert, <I>Co-Executive President</I></b><BR><a href="mailto:jocelyn.liipfert@colorado.edu">Jocelyn.Liipfert@colorado.edu</a><LI><b>Ashley Sullivan, <I>Co-Executive President</I></b><BR><a href="mailto:Ashley.Sullivan@colorado.edu">Ashley.Sullivan@colorado.edu</a><LI><b>Adam Schuckman, <I>V.P. Public Relations/Treasurer</I></b><BR><a href="mailto:adam.schuckman@colorado.edu">Adam.Schuckman@colorado.edu</a><LI><b>Greg Goeken, <I>PFCS</I></b><BR><a href="mailto:gregory.goeken@colorado.edu">Gregory.Goekin@colorado.edu</a><LI><b>Nick Newsum, <I>PFCS</I></b><BR><a href="mailto:nicholas.newsum@colorado.edu">Nicholas.Newsum@colorado.edu</a><LI><b>Leigh Murdock, <I>Coordinator</I></b><BR><a href="mailto:leigh.murdock@colorado.edu">Leigh.Murdock@colorado.edu</a><LI><b>BenHaugen, <I>Historian/Technology Facilitator</I></b><BR><a href="mailto:benjamin.haugen@colorado.edu">Benjamin.Haugen@colorado.edu</a></ul></div> </font>

/* css file modified from bluerobot.com */body {	margin:0px;	padding:0px;	font-size:12px;	color:black;	}h1 {	margin:0px 0px 0px 0px;	padding:0px 0px 0px 5px;	font-size:18px;	font-style:"times new roman";	font-style:bold;	font-style:underline;	font-family:sans-serif;	color:black;	}h2 {	margin:0px 0px 0px 0px;	padding:0px 0px 0px 0px;        font-size:14px;	font-family:serif;        color:black;}                                                    #header1 {	position:absolute;	top:0px		left:0px	height:152px;	width:570px;	border-style:solid;	border-color:black;	border-width:3px 0px 3px 3px;	background-color:#FEC721;	text-align:center;}	#header1 h1{	font-size:45px;	font-style:corsiva;	padding:0px;}#header1 h2{	font-size:24px;	font-style:italic;}#thumb {	position:absolute;	top:0px;	left:567px;	width:230px;	height:152px;	border-style:solid;	border-color:black;	border-width:3px 3px 3px 0px;	background-image: url("../CU2.jpg.jpg");}#content {	position:absolute;	top:155px;	left:0px;	height:700px;	width:570px;	padding:0px;	}#content h2{	text-color:#FEC721;	text-align:left;	backround-color:#990000;	border-style:solid;	border-color:black;	border-width:0px 0px 3px 3px;	}#content p{	padding:30px;	}	#officers {	position:absolute;	top:152px;	left:567px;	height:420px;	width:230px;	border-style:solid;	border-color:black;	border-width:0px 3px 3px 3px;	margin:0px 0px 0px 0px;	backround-color:#FEC721;	}#ofiicers ul{	margin:0px 0px 0px 0px;	text-align:left;	}#officers h1{	text-family:serif;	text-align:center;	}
Link to comment
Share on other sites

Hi,I just tried your code on my server and it worked fine with IE and with FireFox. I only had to change your picture with one of mine. I suppose that the name/extension of your image is not right :

background-image: url("../CU2.jpg.jpg");
It should be something like :
background-image: url("../CU2.jpg");
no?Kind regards from MexicoJerome
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...