HTML Forum

**Space Xscape** · 03:47 PM

Here is my code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

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

<title>

Space Xscape Home Page

</title>

</head>

<body>

<div id="container">

<div id="header">

<h1>Space Xscape Home Page</h1>

</div>

<div id ="navigation">

<a href="index.php">Home</a><br />

<a href="play.php">Play</a><br />

<a href="download.php">Download</a><br />

<a href="about.php">About</a><br />

<a href="screenshots.php">Screenshots</a><br />

<a href="todo.php">To Do List</a><br />

<a href="bugs.php">Bugs</a><br />

<a href="awards.php">Awards</a><br />

<a href="links.php">Links</a><br />

<a href="license.php">License</a>

</div>

<div id="content">

<p>test</p>

</div>

<div id="adbar">

<p>ads</p>

</div>

<div id="footer">

<p>Copyright 2007 Space Xscape Community</p>

</div>

</div>

</body>

</html>

Here is my css:

Code:

h1, p {

margin: 6px 12px; /* adds space between columns *\

}

#containter {

width: 700px;

border: solid 1px;
}

#header {

background: #CCCCCC;

padding: 15px;
}

#navigation {

float: left;

width: 150px;

background: #EEEEEE;
}

#content {

float: left;

width: 400px;
}

#adbar {

float: left;

width: 150px;

background: #EEEEEE;
}

#footer {

clear: both; /* starts the footer below the floated content */

padding: 15px;

background: #666666;
}

And here is what my site link:

http://spacexscape.freepgs.com

Thanks

**LadynRed** · 06-14-2007, 09:53 PM

It looks ok to me in Firefox, and not at all like your screenshot, did you fix it ?

**HighVoltage123** · 06-15-2007, 09:51 AM

why http://spacexscape.freepgs.com/news.php 's header image is different in IE and in FF?!?

**Space Xscape** · 06-15-2007, 02:26 PM

Sorry installed e107 meanwhile i'm working on it.

Here is the link:

http://spacexscape.freepgs.com/site_test/

**LadynRed** · 06-15-2007, 02:54 PM

Ok.. so what, exactly, is wrong with it ?

**Space Xscape** · 02:58 PM

Quote:

Originally Posted by LadynRed

Ok.. so what, exactly, is wrong with it ?

Header is supposed to be on the top, navigation on the left, content on the center, ads on the right and footer on the bottom. Instead content,ads and footer stack on each other.

Example:

**LadynRed** · 06-15-2007, 08:54 PM

Ooh.. you are so going to kick yourself for this one

This is your problem:

Quote:

h1, p {

margin: 6px 12px; /* adds space between columns *\

}

Your comment (in red) is incorrect !! It should be /*adds space between columnts */ ! Since the comment syntax is wrong, it's commenting out the rest of your stylesheet !!

**Space Xscape** · 06-16-2007, 12:52 AM

Oh my god, your a genius! Yes, i did kick myself a few times after fixing it. However i'm still exibiting strange behavior. For some reason my adbar isn't floating all the way to the right and theres a gap between the right edge and the adbar. I have attached a picture to show what i mean.Any ideas?

Space Xscape

**LadynRed** · 06-16-2007, 10:39 AM

Umm.. you need to watch your spelling

#containter {

width: 700px;

border: solid 1px;
}
You want #container

**Space Xscape** · 06-16-2007, 04:12 PM

Hmmm... still having problems. For some reason in IE 6.0 it readers my web page in a wierd way. See the image below. Also is it possible to have my site be displayed in a full screen regardless of the visitors screen resolution?

Thanks

**LadynRed** · 06-16-2007, 08:10 PM

It will look ok in IE once you get some real content inside the div to make it 'stretch' vertically. However, I think you might want to try the faux-columns method to make it look like you have two equal-length columns.
http://www.alistapart.com/articles/fauxcolumns/

If you want the page to stretch horizontally, you're going to have to use percentages for your widths rather than fixed widths.

**Space Xscape** · 06-16-2007, 10:53 PM

So the only way to stretch my page so it covers the entire web browser virtically is to ad content cause i tried height: 100% and it doesn't work although width:100% does.

**LadynRed** · 02:52 PM

Height 100% will work, provided you implement it correctly. See this thread:
http://www.webmaster-talk.com/css-fo...l-browser.html

**Space Xscape** · 06-20-2007, 11:12 AM

Hi,

I'm doing very well with my new site. I'm having problem with my header. I'm using an image that repeats on the x axis from the top left. However i also have a background color which isn't being shown for some reason. Any ideas?