Forum Moderators: not2easy
HTML for page:
<?php
include("database.inc");
$pagetitle = 'Resource';
site_header($pagetitle);
?>
<div id="container" class="clearfix">
<div>
<img src="http://www.example.com/images/top.gif" alt="" />
</div>
<div id="leftresource">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
<div id="rightresource">
<?php
vGoogle();
?>
</div>
<div>
<img src="http://www.example.com/images/bottom.gif" alt="" />
</div>
</div>
<?php
page_footer();
?>CSS for page.
body {
background-color: #f8f4db;
text-align:center;
}#container {
width: 768px;
background-image: url(http://www.www.example.com/images/background.gif);
background-repeat: repeat-y;
background-position: center;
margin:0px auto;
}
#leftresource {
float: left;
width: 600px;
text-align: justify;
padding: 5px;
}
#rightresource {
width: 135px;
margin-left: 625px
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
[edited by: engine at 8:27 am (utc) on April 5, 2005]
[edit reason] No urls, thanks. See TOS [webmasterworld.com] [/edit]
<div><img src="http://www.example.com/images/bottom.gif" alt="" /></div>
instead of:
<div>
<img src="http://www.example.com/images/bottom.gif" alt="" />
</div>
My question however is, why are you using graphics to create the lines, when you can simply use borders around each div?
cheers,
s¦<ube
[edited by: engine at 8:27 am (utc) on April 5, 2005]
[edit reason] examplified [/edit]
The reason I'm using graphics is that the site originlly has the two panels of varying length and I need the shorter panel to extend to meet the height of the longer panel - the solution from 'A List Apart' being what I've used.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
It should work in Firefox. I'm not sure if you need XHTML 1.1 for some particular reason though.
cheers,
s¦<ube
If anyone can conform it now works in FireFox, I'd be happy to know.
Thanks.
