Hi All,
Hope you can help, i have been pulling my hair out over this one and there isnt much left.
I am creating a website which was going to use a menu on each page but then this was getting to complex to I opted for the <?php include("menu.php"); ?> route.
now I have this on all my pages my divs do not want to work
This is the basic file.
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Pirate - ADC Activities - Rotherfield District - Home Page</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="holding">
<div id="centre-top">
</div>
<div id="menu-block"><?php include("menu.php"); ?></div>
<div class="text" id="text-block">
<p class="fronpage style1">Hi, I be pirate, ADC Activities for Rotherfield District, yrr. Welcome me hearty to me’ website, this be where I will put all me details for camps / activites. You’ll be finding that you need to be quick as there are lots of scurvy sprogs out there that will take anything that is going, and spaces go darn quick, yar. Don’t forget to check back regularly to see what booty I have on offer for you’r scurvy sea dogs. Don’t forget to be watching out for the Jolly Roger on the camp.</p>
</div>
<div class="text" id="text-news">
<p class="textheader">Latest News</p>
<p class="text"><span class="textheader"><img src="images/T_Chest.gif" width="37" height="26" hspace="5" /></span><a href="Harry_Potter.html">30th August 2010 - Harry Potter Film Opening Night - details available soon</a></p>
</div>
</div>
</div>
</body>
</html>
This is my CSS file which holds the DIVs
HTML Code:
#holding{
width:1000px;
height:550px;
margin:auto;
background-image:url(images/background.jpg);
background-repeat:no-repeat;
}
#centre-top{
width:auto;
height:100px;
position:static;
}
#menu-block{
width:auto;
height:10px;
padding-left:130px;
padding-bottom: 10px;
}
#footer{
width:900px;
height:10px;
}
#text-block{
width:760px;
height:auto;
margin-left:130px;
}
#text-news{
width:760px;
height:200px;
margin-left: 130px;
}
#text-mainbody{
width:760px;
height:325px;
margin-top:10px;
margin-left: 130px;
overflow-x:none;
overflow-y:scroll;
}
#photos{
width:760px;
height:325px;
margin-top:10px;
margin-left: 130px;
overflow-x:none;
overflow-y:scroll
}
#text-blockbottom1{
width:950px;
height:380px;
}
Can anyone help me in getting the coding right.
Thanks
A live version of the problem can be found here if you select all you can see the text in the div has been located on the bottom left instead of ontop of the image.
|