Menu
Basically I have tried placing two divs side by side (each made up of three separate divs actually). Now everything worked fine before this, the two(six) divs were on top of each other. I then put them in a div container, and each of the two(six) divs were placed in containers that placed them left and right. A clear div was then placed just before the end of the container.
To clarify: (not real code and not all real classes, just showing what I tried doing breifly)
[code]
<div id=”indexwrapper”>
<div id=”left”>
<div id=”left box content”>
this div is three divs to create a top, body and bottom. Body holds all of the content, top and bottom are images.
</div>
</div> <!– end of #left –>
<div id=”right”>
<div id=”right content”>
this div is three divs to create a top, body and bottom. Body holds all of the content, top and bottom are images.
</div>
</div><!– end of #right –>
<div class=”clear”></div>
</div> <!– end of #indexwrapper>
Oddly enough, all of my graphics for the background etc has disappeared and I’m not sure why but it is definately the new div’s that caused this error. I will post the code and hope that someone knows what I did wrong. Probably the slightest error but I can’t really spot them (dodgy eyesight doesn’t help).
Index.php <body>:
[code]
<body class=”oneColFixCtr”>
<center>
<br />
<img src=”/images/guild_title.png” alt=”Guild Title” />
</center>
<br />
<center>
<div id=”divtop”></div>
<div id=”divbody”>
<?php
include ‘navi.php’;
include ‘dbcon.php’;
?>
</div>
<div id=”divbottom”></div>
</center>
<br />
<div id=”indexwrapper”> <!– start of index wrapper –>
<div id=”left”> <!– start of left –>
<div id=”divtopshort”></div>
<div id=”divbodyshort”>
<center>
<br />
<br />
<table id=”content”>
<tr>
<th>
News title image here
<!– <img src=”images/newstitle.png” width=”250″ height=”60″ /> –>
</th>
<th>
Images title image here
</th>
</tr>
<tr>
<td>
<?PHP
$db_handle = mysql_connect($server, $user_name, $password);
$db_found = mysql_select_db($database, $db_handle);
if ($db_found) {
$SQL = “SELECT * FROM phpbb_posts WHERE forum_id = 26 ORDER BY post_time DESC LIMIT 0, 5”;
$result = mysql_query($SQL);
echo “<table id=’news’>”;
while ($db_field = mysql_fetch_assoc($result)) {
echo “<tr><th>”;
print $db_field[‘post_subject’];
echo “</th></tr><tr><td><div>”;
print $db_field[‘post_text’] . “<br /><br /><br />”;
echo “</div></td></tr>”;
}
echo “</table>”;
mysql_close($db_handle);
}
else {
print “Database NOT Found “;
mysql_close($db_handle);
}
?>
</td>
<td>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
<a href=”images/image-1.jpg” rel=”lightbox[test]” title=”my caption”><img src=”images/thumb-1.jpg” /></a>
</td>
</tr>
</table>
</center>
</div>
<div id=”divbottomshort”></div>
</div> <!– end of left –>
<div id=”right”> <!– start of right –>
<div id=”divtoprecruit”></div>
<div id=”divbodyrecruit”>
<center>
<table>
<tr>
<td>
Vacancies!
</td>
</tr>
<tr>
<td>
Jedi Knight Here!
</td>
</tr>
<tr>
<td>
Jedi Consular Here!
</td>
</tr>
<tr>
<td>
Trooper Here!
</td>
</tr>
<tr>
<td>
Smuggler here!
</td>
</tr>
</table>
</center>
</div>
<div id=”divbottomrecruit”></div>
</div><!– end of right –>
<div class=”clear”></div>
</div><!– end of index wrapper –>
</body>
CSS file:
[code]
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
text-align: center;
color: #355c81;
background-image: url(images/background.jpg);
background-repeat: no-repeat;
background-position: center top;
background-color: #000000;
}
#indexwrapper {
margin: 1%;
padding: 0;
width: 97%;
}
#left, #right {
float: left;
width: 46.5%;
margin: 1% 0 1% 1%;
padding: 1%;
}
#right {
float: right;
margin: 1% 1% 1% 3%;
}
.clear {
height: 0;
font-size: 1px;
margin: 0;
padding: 0;
line-height: 0;
clear: both;
}
There is more to the CSS file but that all worked fine, so I only added the newer stuff with the body which is fine.
I would’ve edited each of the