html help problems between firefox / ie

Associate
Joined
25 Oct 2002
Posts
1,707
hi, im afraid im not real coder know a few simple bits and peices but thats it and hence me needing help!

problem is ive made a basic site template through the basic html i know and either trawling the web for turtorials or in the case of the drop down menu modifying existing code to suit, however.......

the site works as it should in firefox, apart from some minor image adjustment the problem is with ie the dropdown menu is placed to the far right and the links dont work on it, ive tried to fix but with no success hence me posting here.

site as it appears in firefox:
firefox.jpg


site as it appears in internet explorer:

internetexplorer.jpg


the green highlight shows where the dropdown menu should be also is the problems of the two side images being placed over the top of the banner in internet explorer although at this point that does not concern me so much

code used, blue is the dropdown menu code i pickup up from some turtorial site, cant remember where :-(:
Code:
<head.
<script>
[COLOR=blue]<!--
function land(ref, target)
{
lowtarget=target.toLowerCase();
if (lowtarget=="_self") {window.location=loc;}
else {if (lowtarget=="_top") {top.location=loc;}
else {if (lowtarget=="_blank") {window.open(loc);}
else {if (lowtarget=="_parent") {parent.location=loc;}
else {parent.frames[target].location=loc;};
}}}
}
function jump(menu)
{
ref=menu.choice.options[menu.choice.selectedIndex].value;
splitc=ref.lastIndexOf("*");
target="";
if (splitc!=-1)
{loc=ref.substring(0,splitc);
target=ref.substring(splitc+1,1000);}
else {loc=ref; target="_self";};
if (ref != "") {land(loc,target);}
}
//-->[/COLOR]
</script>
</head>


<body BGCOLOR="808080"">

<iframe src ="banner.html"
NAME=banner
width="100%"
height=200
frameborder=0
scrolling=no>
</iframe>


<IMG STYLE="position:absolute; TOP:182px; LEFT:9px; WIDTH:200px; HEIGHT:529px" SRC="left.gif">
<IMG STYLE="position:absolute; TOP:180px; LEFT:828px; WIDTH:200px; HEIGHT:471px" SRC="right.gif">
<IMG STYLE="position:absolute; TOP:600px; LEFT:5px; WIDTH:1020px; HEIGHT:100px"  SRC="bottom.gif">

<iframe src=main.html
 name="main" width="620px" height="400px"
style="position:absolute; TOP:215px; LEFT:190px"


frameborder=0
scrolling=yes>
</iframe>





<H1 align="left">
<DIV STYLE="position:absolute; TOP:140px; LEFT:50px; WIDTH:308px; HEIGHT:25px"> <a href="about.html" target="main">about us</a>




<DIV STYLE="position:absolute; TOP:0px; LEFT:800px; WIDTH:308px; HEIGHT:25px"><a href="contact.html" target="main">contact us</a>
</h1>


<DIV STYLE="position:absolute; TOP:152px; LEFT:400px; WIDTH:308px; HEIGHT:25px">

[COLOR=blue]<form action="dummy" method="post"><select name="choice" size="1" onChange="jump(this.form)">
<option value="">Media menu</option>
<option value="prgallery.html*main">pr shots</option>
<option value="">---- Ulster Scots Summer Schools 2006 ----</option>
<option value="4augnewmosely.html*main">4th aug 06 - new mosely</option>
<option value="25julynewry.html*main">25th july 2006 - newry</option>
<option value="26julynewmoselyfest.html*main">26th july 2006 - new mosely festival</option>
<option value="26julynewmoselyfest.html*main>26th july 2006 - new mosely festival</option>[/COLOR]
 
Add a HTML 4.01 Strict doctype then try messing about. With no doctype you're using both browsers in quirks mode which isn't even worth trying to fix.

Also don't use inline styling, it's very bad practice, you're best putting it all in a separate style sheet....that way you're separating presentation and content.
 
Back
Top Bottom