PDA

Click to See Complete Forum and Search --> : [RESOLVED] Need Help in FireFox.. any fox around here?

cfexecute
04-17-2007, 12:38 AM
Hello Guys,

I'm trying to get this code to look the same as IE in FF without any luck. In IE this display 100% of the browser as I want, but in FF middle div also take ‘100% of the browser size’ insisted the 100% of the available space, making surrounding table size more than 100%.
Here is the link to page, please check in IE and FF, you will notice

the deference in height
http://www.redlyrics.com/test.htm

here is the code:


<table width="100%" height="100%" style="height:100%" cellpadding="0" cellspacing="0" bgcolor="#999900"><tr><td valign="top">
<div style="height:100px; width:100%; display:table; background-color:#99CCCC">top</div>
<div style="width:100px; height:100%; background-color:#FFFF99;">left</div>
</td></tr></table>


thanks
Sam
Znupi
04-17-2007, 03:30 AM
Lol, your page is so unvalid... Ever heard of the <html> tag?? The <head> tag?? The <body> tag?? Not to mention the DTD!
Stephen Philbin
04-17-2007, 05:42 AM
We'd prefer it if members helped the newcomers, rather than belittled them, Znupi.

Have a look at this, Sam. http://www.w3schools.com/html/html_intro.asp It's a helpful introduction to HTML. It's not exactly comprehensive and entirely accurate, but it's a better starting point than most.
Charles
04-17-2007, 05:49 AM
Lol, your page is so unvalid... Ever heard of the <html> tag?? The <head> tag?? The <body> tag?? Not to mention the DTD!Just to be clear, the HTML, HEAD and BODY start and end tags are all optional. On the other hand you do need a DOCTYPE a TITLE and you need to declare the character encoding.

The bare minimum looks like:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>But it's common to flesh that out a little to:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title></title>
</head>
<body>

</body>
</html>
umd2007
04-17-2007, 06:36 AM
Hey as far as i can see they both look the same in ie7 and firefox 2.0 when maximised and when i select the size of browser, does this help at all lol sorry if it doesn't! Chris
cfexecute
04-17-2007, 11:56 AM
Hi Guys,

Thanks for the help. the reason i didnt add the ddt in to the example because i want to show how it works in quick mode.. thought that can help you to understand my problem.

anyway, after playing with css like two hours.. i get both browsers to work similar. here is the "Proper" code:

thanks
sam



<!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>Untitled Document</title>
<style type="text/css">
html,body{
margin:0;
padding:0;
height:100%;
border:none
}
</style>

</head>
<body

<div style="background-color:#999900; width:100%; height:100%">
<div style="height:100px; width:100%; display:table; background-color:#99CCCC">top</div>
<div style="width:100px; height:100%; background-color:#FFFF99; position:fixed">left</div>
</body>

</body>
</html>
WebJoel
04-18-2007, 11:00 AM
<!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>Untitled Document</title>
<style type="text/css">
html,body{
margin:0;
padding:0;
height:100%;
border:none
}
</style>

</head>
<body

<div style="background-color:#999900; width:100%; height:100%">
<div style="height:100px; width:100%; display:table; background-color:#99CCCC">top</div>
<div style="width:100px; height:100%; background-color:#FFFF99; position:fixed">left</div>
</body>

</body>
</html> Still missing the closing-bracket for the opening of "<body>" tag...

And only one closing "</body>" is required...