Jump to content

Mozilla does not recognise % height values, only px values


myownslave

Recommended Posts

height:40%; IE will display the div correctly - 40% of the height of the browser window. But Mozilla doesn't seem to recognise a % value and just sets the height of the div to automatically fit the amount of text in it. If I set the height:40px; then Mozilla will recognise this alright and will set the height of the div to 40 pixels.This only happens when using relative positioning - using absolute positioning, Mozilla does seem to recognise height:40%;

Link to post
Share on other sites

In IE I wasn't able to use percentages either, with the height property.Don't know what that is all about :) All since, I use only pixels in the height property :)I'd like to know too why percentages don't work :)

Link to post
Share on other sites
Set the height of your body to 100%. Then see if the 40% works.
Already have the BODY height at 100%The % works fine in IE, but Mozilla just ignores the value and sets the height to fit the content. I need a set value for the height, default value won't work.Here's my code:<?XML version="1.0" encoding="UTF-8"?><!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/XHTML11/DTD/XHTML11.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><HEAD><META http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/><TITLE>THE FENIANS GAA CLUB - News</TITLE><META name="Author" content="Jim Broderick"/><STYLE type="text/css"> BODY { margin:15px 0px; border:0; padding:0px; width:100%; height:100%; max-height:100%; background:#000099; text-align:center; font-family:arial, verdana, sans-serif; font-size:0.8em; overflow:auto; } #HEADER { top:0px; left:0px; right:0px; width:100%; margin-top:0px; margin-bottom:15px; height:90px; overflow:hidden; background:#FFFFFF; } #MENU { padding:0px; top:0px; margin:0px auto; margin-bottom:15px; height:25px; width:764px; overflow:hidden; background:#000099; text-align:center; } #CONTENT { top:0px; margin:0px auto; width:764px; height:74%; padding:15px; background:#FFFFFF; text-align:left; text-indent:40px; overflow:auto; } </STYLE></HEAD><BODY><FONT color="#000000" face=Verdana><DIV id="HEADER">Page Header</DIV><DIV id="MENU">Horizontal Menu</DIV><DIV id="CONTENT">Content Area</P></DIV></FONT></BODY></HTML>
Link to post
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...