Welcome Guest ( Log In | Register)



 
 Reply to this topicStart new topic
> Div Child Height Same Height As The Father, how to set child height to be the same..
mizako
post Sep 5 2005, 09:14 PM
Post #1


Super Member
*********

Group: Members
Posts: 372
Joined: 16-August 04
From: Spain
Member No.: 824
I will try to explain myself as briefly as possible. I want have the next
xhtml squeletone:
CODE

<html>
 <head>
 </head>
 <body>
 <div id="container">
   <div id="header">
     <div id="searchEngine">
       <!-- Search Engine Markup >
     </div>
   </div>
   <div id="header2">
   </div>
   <div id="primarynav">
       <!-- primary nav Markup >
   </div>
   <div id="content">
       <!-- content Markup >
   </div>
 </div>
 </body>
</html>

This is the css code applied to the previous markup:
CODE

#container {
 position: absolute;
 left: 50%;
 width: 770px;
 top: 20px;
 margin-left: -385px;
 background: #cccccc;
}
#primarynav {
 position: relative;
 width: 160px;
 background: #333333;
 margin: 0px;
 padding: 0px;
 float: right;
}
#header2 {
 position: relative;
 background: #999999;
 height: 150px;
 width: 40px;
 float: right;
}
#header {
 position: relative;
 background: #999999;
 height: 150px;
 width: 570px;
 float: left;
 background: url(../images/background.jpg) top left no-repeat;
}
#content {
 position: relative;
 float: left;
 overflow: auto;
 background: #cccccc;
 width: 570px;
 margin: 0px;
 padding: 0px;
}


Right now i am obtaining the next output:
user posted image
But i want to obtain an output in which the primary nav goes until the bottom of the container as shown in the figure:
user posted image
Any idea how can i manage to do that with CSS?
Help is really, really appreciated.


(list)

Go to the top of the page
 
+Quote Post
arboc7
post Sep 5 2005, 10:23 PM
Post #2


Advanced Member
*******

Group: Members
Posts: 123
Joined: 5-September 05
Member No.: 11,522
I think I might know you may need to do in your CSS file.


I think you need to do something like this:
CODE

#primarynav {
 height:100%;
}


Please note that this may not be supported by all browsers. You may need to use various workarounds or "filters" which can be found here: http://centricle.com/ref/css/filters/

Hope this helps!!

(list)

Go to the top of the page
 
+Quote Post
mizako
post Sep 6 2005, 06:51 AM
Post #3


Super Member
*********

Group: Members
Posts: 372
Joined: 16-August 04
From: Spain
Member No.: 824
QUOTE(arboc7 @ Sep 5 2005, 10:23 PM)
I think I might know you may need to do in your CSS file.
I think you need to do something like this:
CODE

#primarynav {
 height:100%;
}


Please note that this may not be supported by all browsers. You may need to use various workarounds or "filters" which can be found here: http://centricle.com/ref/css/filters/

Hope this helps!!
*



Thanks! it seems that the next code fixes the problem. However i remember me trying this before without success. Thanks again.
CODE
#container {
...
height: 100%;
...
}

#primarynav {
...
height: 100%;
...
}



(list)

Go to the top of the page
 
+Quote Post
« Next Oldest · HTML, XML etc.. · Next Newest »
 

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Popup Window With Height And Width?(9)


 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 11th October 2008 - 07:46 AM
Powered By IP.Board © 2008  IPS, Inc.
Licensed to: Xisto Corporation