Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

How To adjust a height element ? (Newbie)

0 views
Skip to first unread message

Stan Sainte-Rose

unread,
Nov 4, 2004, 5:41:17 AM11/4/04
to
Hi,

I would like to automatically adjust the size of a div element.
I have a Vertical navigation bar on the left using a background color and
a content section (at the right of the vertical navigation) with another
background color

I would like, when the content section height increased, the vertical
navigation
automatically increases too to get the same look feel.

Any help ?
Stan


mscir

unread,
Nov 4, 2004, 3:31:44 PM11/4/04
to
Stan Sainte-Rose wrote:

Is javascript an option? Example code:

<style type="text/css">
.div1 {
width: 50%;
height: 100px;
float: left;
background-color: #FFAABB;
}
.div2 {
width: 50%;
height: 200px;
float: left;
background-color: #FFEECC;
}
</style>

<script type="text/javascript">
function setheight(){
d1=document.getElementById('div_1');
d2=document.getElementById('div_2');
d1.style.height=d2.offsetHeight;
}
</script>


<div class="div1" id="div_1"></div>
<div class="div2" id="div_2"></div>
<input type="button" onclick="setheight()" value="set menu div height">


mscir

unread,
Nov 4, 2004, 3:46:48 PM11/4/04
to
mscir wrote:

> <script type="text/javascript">
> function setheight(){
> d1=document.getElementById('div_1');
> d2=document.getElementById('div_2');
> d1.style.height=d2.offsetHeight;
> }
> </script>

I left out the 'px' string at the end of the offsetHeight for
cross-browser compatability. Should be:

<script type="text/javascript">
function setheight(){
d1=document.getElementById('div_1');
d2=document.getElementById('div_2');

d1.style.height=d2.offsetHeight+'px';
}
</script>

This code works on my IE6, Netscape 7.2, Firefox 1PR, Mozilla 1.7.3
(previous version was IE only):

Tip was found here:

http://archive.devx.com/dhtml/articles/sl011701/sl011701p2-1.asp

Sorry for any confusion I caused,
Mike

Stan Sainte-Rose

unread,
Nov 5, 2004, 2:37:06 AM11/5/04
to
Thanks so much, I ll try your code
Stan

"mscir" <ms...@access4less.net> a écrit dans le message de news:
10ol59q...@corp.supernews.com...

0 new messages