Jump to content

[SOLVED] 100% Height


tarun

Recommended Posts

Right, I have this 100% height layout but it isn't the whole height of the area avaiable its a maybe few pixel over. I have a included a 2 screen shots one is a real screen shot of what it looks like. The other is an edited version, which is what i want it to look like. Both layouts appear the same in IE an Firefox.

 

Screenshots:

Real screenshot of what I have now.

Edited screenshot of what I aim to have/want.

 

I have also provided the HTML 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> 
<title>...</title> 
<style type="text/css" media="screen"> 
body { 
margin: 0; 
padding: 0; 
height: 100%;
} 
#left { 
position: absolute;
left: 0;
top: 0;
padding: 0;
width: 200px;
height: 100%;
color: #333;
background: #eaeaea;
border: 1px solid #333;
}

#content {
position: absolute;
left: 200px;
top: 0;
right: 0;
padding: 0;
height: 100%;
color: #333;
background: #ffc;
border: 1px solid #333;
overflow: scroll;
}

#left p {
padding: 10px;
}

#content p {
padding: 10px;
}
</style> 
</head> 

<body> 
<div id="left"> 
<p class="top">aopjfshkmal;hba ha</p> 

<p>aharijkuyjrawtrwh</p> 

<p>auetbvdfhiti7okl,hevd</p> 
</div> 

<div id="content"> 
<p>Tsetukuyskpf;ps'ra3w'lmrtefkdylatsururtyryrt.fok./owe sjheak, asiuflajrlk eaiojra.r arsfs eatheakra gaiojtnar atkajehtakn.trna</p> 
</div>
</body> 
</html>

Link to comment
https://forums.phpfreaks.com/topic/69927-solved-100-height/
Share on other sites

Archived

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

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.