Log in

View Full Version : Layout problem :p


Swearwolf
30-09-2007, 04:20 PM
OK so my site is www.aceodea.com (http://www.aceodea.com)
and if theres more than one line in the navigation, the content box on the right moves down, as you can see. any help to make it fixed? here is index.php.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- Free Habbo CSS Layout by Invent! -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Aceodea.com - Your friendly Habbo Fansite</title>
<style type="text/css">
<!--
body {
background-position: top;
background-image: url(images/backgroundtreees.png);
background-repeat:repeat-x;
background-color: #548d00;
margin-top: 6px;
}
#top {
background-image: url(images/top.gif);
background-repeat: no-repeat;
background-position: bottom;
width: 781px;
max-height: 7px;
min-height: 7px;
}
#middle {
background-image: url(images/middle.gif);
background-repeat: repeat-y;
width: 781px;
}
#bottom {
background-image: url(images/bottom.gif);
background-position: top;
background-repeat: no-repeat;
width: 781px;
height: 7px;
}
#banner {
background-image: url(images/bannor.gif);
width: 764px;
height: 126px;
}
#container {
width: 100%;
margin-top: 15px;
text-align: left;
}
#leftcontainer {
text-align: left;
width: 300px;
padding-left: 10px;
}
#rightcontainer {
margin-top: -110px;
margin-left: 248px;
}
/* Box DIVS */
#top_box {
background-image: url(images/left_box_top.gif);
background-repeat: no-repeat;
width: 221px;
height: 22px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
padding-top: 6px;
padding-left: 10px;
}
#box_mid {
background-image: url(images/left_box_mid.gif);
background-repeat: repeat-y;
width: 221px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding-left: 6px;
padding-right: 6px;
}
#box_bot {
background-image: url(images/left_box_bot.gif);
background-repeat: no-repeat;
width: 221px;
height: 10px;
}
/* End of boxes */
/* //////////// */
/* Content box DIVS */
#content_top {
background-image: url(images/content_box_top.gif);
background-repeat: no-repeat;
width: 523px;
height: 22px;
text-align: left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
padding-top: 6px;
padding-left: 8px;
}
#content_mid {
background-image: url(images/content_box_mid.gif);
background-repeat: repeat-y;
width: 510px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
text-align: left;
padding-left: 6px;
}
#content_bot {
background-image: url(images/content_box_bot.gif);
background-repeat: no-repeat;
width: 522px;
height: 10px;
}
/* End of content box divs */
/* ////////////////////// */
/* Disclaimer box */
#disclaimer {
margin-top: 10px;
}
#disc_top {
background-image: url(images/disc_top.gif);
background-position: bottom;
background-repeat: no-repeat;
width: 762px;
height: 11px;
}
#disc_mid {
background-image: url(images/disc_mid.gif);
width: 762px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
#disc_bot {
background-image: url(images/disc_bot.gif);
background-position: top;
background-repeat: no-repeat;
width: 762px;
height: 11px;
}
/* Font styles */
#title {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-transform: uppercase;
color: #003366;
font-weight: bold;
}
#subtitle {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: normal;
font-style: italic;
color: #003366;
}
span {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
}
span a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
font-style: normal;
text-decoration: none;
}
span a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
font-weight: bold;
font-style: normal;
text-decoration: none;
}
span a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
font-style: normal;
text-decoration: none;
}
#disclaimer {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
#disclaimer a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-style: normal;
text-decoration: none;
}
#disclaimer a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
font-style: normal;
text-decoration: none;
}
#disclaimer a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-style: normal;
text-decoration: none;
}
-->
</style>
</head>

<body>

<div id="sitecontainer" align="center">

<div id="top"></div>

<div id="middle">


<!-- Banner -->
<div id="banner"></div>
<!-- End of banner -->

<!-- Page container -->
<div id="container">
<!-- ///////////////////// -->
<!-- Content box -->

<div id="leftcontainer">
<!-- Navigation box -->
<div id="navigation">
<!-- Top of navigation box (title) -->
<div id="top_box"> &raquo; Navigation </div>
<!-- End of top -->
<!-- Navigation box -->
<div id="box_mid">

<a href="index.php?page=home">Home</a><br />
<a href="index.php?page=habbouk">Habbo UK</a><br />
<a href="index.php?page=habbouk">Habbo UK</a><br />
<a href="index.php?page=habbouk">Habbo UK</a><br />
<a href="index.php?page=habbouk">Habbo UK</a><br />
<a href="index.php?page=habbouk">Habbo UK</a><br />

</div>
<!-- End of navigation box -->
<!-- Bottom of box -->
<div id="box_bot"></div>
<!-- End of bottom of box -->
</div>
<!-- End of navigation box -->
<div id="spacer" style="padding-top: 10px;"></div>
<!-- Radio player box -->
<div id="rp_box">
<!-- Top of radio player box (title) -->
<div id="top_box"> &raquo; Radio Player </div>
<!-- End of top -->
<!-- Radio player box -->
<div id="box_mid">lolcopters</div>
<!-- End of radio player box -->
<!-- Bottom of box -->
<div id="box_bot"></div>
<!-- End of bottom of box -->
</div>
<!-- End of radio player box -->
</div>
<div id="rightcontainer">

<div id="content_top">
&raquo; Content
</div>

<div style="padding-right: 6px;" id="content_mid">
<?php

if($_GET['page']) {
$page = $_GET['page'];
$page = str_replace(".", "", $page);
$page = "".$page.".php";

if(file_exists($page)) {
include("$page");
} else {
include("404.php");
}
}
else {
include("home.php");
}

?>

</div>

<div id="content_bot"></div>

</div>

<!-- End of content box-->
</div>
<!-- End of page container -->
<!-- Please do not remove ANY copyright disclaimers on the disclaimer page or on this page -->
<div id="disclaimer">

<div id="disc_top"></div>

<div id="disc_mid">
<? include("disclaimer.php"); ?>
</div>

<div id="disc_bot"></div>

</div>


</div>

<div id="bottom"></div>

</div>

</body>
</html>
<!-- Free Habbo CSS Layout by Invent! -->
Chippiewill
30-09-2007, 06:35 PM
lol same layout as im using and i have exactly the same problem lol
Swearwolf
30-09-2007, 06:52 PM
lol ace if i find out ill let you know
RedCrisps
30-09-2007, 07:18 PM
mm why don't people just code using tables =]

Want to hide these adverts? Register an account for free!