Help Please

Raven12388 · Posted: Sat Apr 12, 2008 1:12 pm Post subject: Help Please

Hi all

Ok well my site works fine in IE but looks odd in opera with out a doctype
as soon as i add the doctype it renders oddly in both IE and Opera

here is the code please someone help

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"><html>

<html>

<head><link rel="stylesheet" type="text/css" href="mystyles.css">
<title>UK Fish Hunt</title>

</head>
<body>

<center>

<div class="Header">
<img src="top.jpg"width="100%"border="0">
</div>

<div class="Container">
<div class="Navigation">
<img src="h1.jpg">
<a href="#"><img src="pl1.jpg"border="0"></a><br>

<img src="h2.jpg">
<a href="#"><img src="os1.jpg"border="0"></a><br>
<a href="#"><img src="os2.jpg"border="0"></a><br>
<a href="#"><img src="os3.jpg"border="0"></a><br>
<a href="#"><img src="os4.jpg"border="0"></a><br>
<a href="#"><img src="os5.jpg"border="0"></a><br>
<a href="#"><img src="os6.jpg"border="0"></a><br>
<a href="#"><img src="os7.jpg"border="0"></a><br>
<a href="#"><img src="os8.jpg"border="0"></a><br>
<a href="#"><img src="os9.jpg"border="0"></a><br>

<img src="h3.jpg">
<a href="#"><img src="os10.jpg"border="0"></a><br>
<a href="#"><img src="os11.jpg"border="0"></a><br>
<a href="#"><img src="os12.jpg"border="0"></a><br>
<a href="#"><img src="os13.jpg"border="0"></a><br>
<a href="#"><img src="os14.jpg"border="0"></a><br>
<a href="#"><img src="os15.jpg"border="0"></a><br>
<a href="#"><img src="os16.jpg"border="0"></a><br>

<img src="h4.jpg">
<a href="#"><img src="pl2.jpg"border="0"></a>
</div>

<div class="Content">
<img src="h5.jpg"border="0"align="top"><br><br><br>
<a href="#"><img
src="me1.jpg"border="0"align"middle"></a><br><br><br>
</div>

<div class="Content">
<img src="h6.jpg"border="0"align="top"><br><br><br>
<a href="#"><img src="bellslane1.jpg"border="0"align"middle"></a><br><br><br>
</div>

<div class="Content">
<img src="h8.jpg"border="0"align="top"><br><br><br>
<a href="#"><img src="phil1.jpg"border="0"align"middle"></a><br><br><br><br>

</div>

</div>

<div class="Footer">
<br>
<img src="bottom.jpg"width="100%">
</div>

</center>

</body>

</html>

and this is the style sheet

DIV.Header
{
background-color:#8cd3d7;
width: 885px;
border: 3px double #003466;
margin: 1px;
padding: 1px;

}

DIV.Container
{
width: 895px;

}

DIV.Navigation
{
text-align:left;
background-image: url(background2.jpg);
width: 185px;
float:left;
border: 3px double #003466;
padding: 2px;
margin: 1px
}

DIV.Content
{

background-image: url(background2.jpg);
width: 688px;
float:right;
border: 3px double #003466;
padding: 1px;
margin: 1px
}

DIV.Footer
{

background-image: url(background2.jpg);
width:885px;
clear:both;
border: 3px double #003466;
margin: 1px;
padding: 1px
}

BODY

{

background-image: url(background1.jpg);background-attachment: fixed;
color:#003265;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif
}

Thanks
Brian

Johnathan · Posted: Sat Apr 12, 2008 1:34 pm Post subject: Re: Help Please

Put the doctype in then goto http://validator.w3.org/ and validate it, and check the box to fix your code then copy into your page and it should render properly in both.

Raven12388 · Posted: Sat Apr 12, 2008 3:02 pm Post subject: Re: Help Please

thanks Johnathan

Well i did that and got it working perfect in IE.

Firefox and Opera get it almost perfect apart from a space in them browsers that are not on IE

is it possabe to get it perfect in all browsers using code or is it better to do the whole site as images then just using the coding to house the images???

Johnathan · Posted: Sat Apr 12, 2008 3:05 pm Post subject: Re: Help Please

Yea you can get it perfect in all browsers using code, as long as it is fully standard compliant and sometimes you need sort of cheats for certain browsers.

Raven12388 · Posted: Sat Apr 12, 2008 3:21 pm Post subject: Re: Help Please

well it all validated after i fixed the erros

on Opera and firefox i have a 20px gap between the navagation div and the footer div but it lines up perfect in IE apart from that it is perfect in all browsers any ideas?? here are images of whats happening

IE browser

Opera and firefox

Thanks
Brian

dflynn · Posted: Tue Apr 15, 2008 2:06 am Post subject: Re: Help Please

I dunno if youve caught this already but you have 2 html tags at the beginnign of your code.

I don't think that will fix anything but coding is coding.
cheers

rangana · Posted: Tue Apr 15, 2008 2:12 am Post subject: Re: Help Please

Yes well spotted dflynn Smile

@Raven12388,
Fix how you call your images, give them spaces:

Raven12388 · Posted: Tue Apr 15, 2008 4:29 pm Post subject: Re: Help Please

Thanks Guys all fixed much apreciated