...

View Full Version : Scroll Bar in Div to be removed



moneysharma
05-23-2012, 04:30 PM
I want to remove the scroll bar that is coming in the image shown.
Coding is also provided.
Please check and tell.
http://i45.tinypic.com/3136k1u.png



<html>

<head>
<style type="text/css">
#container{
position:relative;
width:100%;
height:100%;
background-color:#FEF0C9;
overflow-y:scroll;
}

#l1{
position:absolute;
width:200px;
height:200px;
top:10px;
background-color:green;
}

#l2{
position:absolute;
width:200px;
height:200px;
top:230px;
background-color:green;
}

#l3{
position:absolute;
width:200px;
height:200px;
top:460px;
background-color:green;
}

#r3{
position:absolute;
width:200px;
height:200px;
top:690px;
background-color:green;
}



#header{
width:100%;
height:200px;
background-color:blue;
}

#innercontainer{
position:relative;
width:60%;
min-height:100%;
background-color:red;
overflow-y:scroll;
}





</style>
</head>
<body>

<div id="container">

<div id="header">
</div>

<div id="innercontainer">

<div id="l1">

</div>

<div id="r1">

</div>

<div id="l2">
</div>

<div id="r2">
</div>

<div id="l3">
</div>

<div id="r3">
</div>

</div><!--Inner Container-->

</div>
</body>
</html>

Nitro3k
05-23-2012, 07:55 PM
#container {
position:relative;
width:100%;
height:100%;
background-color:#FEF0C9;
overflow-y: hidden;
}

#E: i guess it is actually #innercontainer but the code you privided does not give the result in the picture.

COBOLdinosaur
05-23-2012, 08:59 PM
just remove the overflow-y and drop the height. The div will then size to content. Height:100% is redundant the defaut is auto which resolves to 100%.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum