Ok, on my site: http://rs2helpguide.frih.net/test.php/index.php
I have my test layout, at the bottom where it has the white end bit, its not joining up with the rest of the layout.
Picture:
CSS:
| Code: |
/** TOP PICTURE */
#topback {
width: px;
text-indent: .30cm;
height: 191px;
background-image: url('http://www.rs2helpguide.frih.net/images/main.PNG');
background-position: top center;
background-repeat: no-repeat;
}
/** UNDER THE TOP */
#undertop {
width: px;
height: 28px;
background-image: url('http://www.rs2helpguide.frih.net/images/Navagationonpic.PNG');
background-position: top center;
background-repeat: no-repeat;
}
/** THE SIDES-LONG */
#sides-long {
width: 928px;
height: px;
background-image: url('http://www.rs2helpguide.frih.net/images/sides-long.PNG');
background-position: center center;
background-repeat: repeat;
}
#sides-bottom {
width: 928px;
height: 13px;
background-image: url('http://www.rs2helpguide.frih.net/images/sides-bottom.PNG');
background-position: center center;
background-repeat: no-repeat;
}
#bottom {
font-size: 10px;
font-color: #FFFFFF;
font-weight: normal;
}
body { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: black; background-color: white}
A:link { COLOR: #FFFFFF; TEXT-DECORATION: none;font-weight: normal; font-family:arial; font-size:8pt }
A:visited { COLOR: #FFFFFF; TEXT-DECORATION: none;font-weight: normal; font-family:Verdana; font-size:8pt }
A:active { COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Verdana; font-size:8pt }
A:hover { COLOR: #FF0000; TEXT-DECORATION: none; font-weight: none; font-family:Verdana; font-size:8pt } |
Index Code:
| Code: |
<style type="text/css">
<title>Gamers 08 - The home of all games!</title>
mm.margin {margin: 5cm}
</style>
</head>
<body background="http://images.freewebs.com/Members/Generationz/CSSStyles/Gaming/Blue/bg.gif">
<link rel="stylesheet" href="style.css" type="text/css">
<div id="topback"><mm class="margin">
<IMG SRC="/test.php/navagationpicture1.gif">
</div>
<div id="undertop">
<center>
<table border = "0" cellspacing="5">
<tr>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=1">Home</a></td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=2">Game Reviews</a></font></b></td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=3">Link 3</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=4">Link 4</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=5">Link 5</a></font></b> </td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=6">Link 6</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=7">Link 7</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=8">Link 8</a></font></b> </td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=9">Link 9</a></font></b></td>
</tr>
</table>
</div>
<center>
<div id="sides-long">
<?php
$cat = isset($_GET['cat']) ? intval($_GET['cat']) : "";
if ( !empty($cat) )
{
include("cat_main.php");
}
?>
<div id="sides-bottom">
</div>
<div id="bottom"> RS2 Help Guide © 2007-2007 All pictures were created by us. </div> |
I will see what I can do when I get home...
Dan...
Soz bout the double post...
well got it to work... (well works for me) but i have copyied the hole HTML (from HTML 2 /HTML)
| Code: |
<!DOCTYPE HTML PUBLIC "XHTML 1.0 Transitional//EN" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Gamers 08 - The home of all games!</title>
<style type="text/css">
<!--
/** TOP PICTURE */
#topback {
width: px;
text-indent: .30cm;
height: 191px;
background-image: url('http://www.rs2helpguide.frih.net/images/main.PNG');
background-position: top center;
background-repeat: no-repeat;
}
/** UNDER THE TOP */
#undertop {
width: px;
height: 28px;
background-image: url('http://www.rs2helpguide.frih.net/images/Navagationonpic.PNG');
background-position: top center;
background-repeat: no-repeat;
}
/** THE SIDES-LONG */
#sides-long {
width: 928px;
height: px;
background-image: url('http://www.rs2helpguide.frih.net/images/sides-long.PNG');
background-position: center center;
background-repeat: repeat;
}
#sides-bottom {
width: 928px;
height: 13px;
background-image: url('http://www.rs2helpguide.frih.net/images/sides-bottom.PNG');
background-position: center center;
background-repeat: no-repeat;
}
#bottom {
font-size: 10px;
font-color: #FFFFFF;
font-weight: normal;
}
body { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: black; background-color: white}
A:link { COLOR: #FFFFFF; TEXT-DECORATION: none;font-weight: normal; font-family:arial; font-size:8pt }
A:visited { COLOR: #FFFFFF; TEXT-DECORATION: none;font-weight: normal; font-family:Verdana; font-size:8pt }
A:active { COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Verdana; font-size:8pt }
A:hover { COLOR: #FF0000; TEXT-DECORATION: none; font-weight: none; font-family:Verdana; font-size:8pt }
mm.margin {margin: 5cm}
</style>
</head>
<body background="http://images.freewebs.com/Members/Generationz/CSSStyles/Gaming/Blue/bg.gif">
<link rel="stylesheet" href="style.css" type="text/css">
<div id="topback"><mm class="margin">
<IMG SRC="/test.php/navagationpicture1.gif">
</div>
<div id="undertop">
<center>
<table border = "0" cellspacing="5">
<tr>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=1">Home</a></td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=2">Game Reviews</a></font></b></td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=3">Link 3</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=4">Link 4</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=5">Link 5</a></font></b> </td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=6">Link 6</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=7">Link 7</a></font></b> </td>
<td><b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=8">Link 8</a></font></b> </td>
<td>
<b><font face="Arial" size="1" color="#FFFFFF"><a href="index.php?cat=9">Link 9</a></font></b></td>
</tr>
</table>
</div>
<center>
<div id="sides-long">
<?php
$cat = isset($_GET['cat']) ? intval($_GET['cat']) : "";
if ( !empty($cat) )
{
include("cat_main.php");
}
?>
<div id="bottom"> RS2 Help Guide © 2007-2007 All pictures were created by us. </div>
</div><div id="sides-bottom">
</div>
</body>
</html> |
Hope this works..
If you require anymore help Give me a shout...
Dan... I used that code and themn it made the gap 3x bigger.
what browser are you using?
But still it should work in any browser.. giv me a sec..
Using Mozila, i was messing around with it more and stuffed it :l But still got past code. It was working perfectly before i added an another bar thing which now i took away.
Sorry for double post.
Solved!
| Code: |
position:relative;
Top:-10px;
|
| Runescapetown wrote: |
Sorry for double post.
Solved!
| Code: |
position:relative;
Top:-10px;
|
|
Oh thats good its wierd coz I tested it in firefox and IE and there was no gap... was solid as a rock lol
and I didn't even notice the -10px 
but dude to be honest I would rewrite your CSS and re oginise your HTML.. its like a maze... doesn't help when you want to edit it or find problems (like now)
Do you have a certain way of writing it? I mean layout wise. I have my own way of doing it...
And i would recoment using a cache control if you are going to update your site alot. Saves have to refresh on every visit (onli for an updated page)
Dan...Yes i re orgainsed my CSS code, now its in a neat fashion 
It helps.
EDIT** i added the reltive top-10 thing. Ok cool.
What webdesign software do you use? I use Dreamweaver 8... (and notpad lol)
