471,603 Members | 1,484 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,603 software developers and data experts.

frame size issue

35
how can i make a div tag fill all the area inside body tag while its empty
ie.
[HTML]<body>
<div id="wrapper">
</div>
</body>[/HTML]

i'm putting this inside a frame, which i want it to be of fixed size because if i put a table inside the div and mangle with its size , the frame gets out of bound while i want it to be of fixed layout no matter what's inside it.
Sep 26 '07 #1
6 2584
You will need to do it with CSS, so in the HTML file, you have:
Expand|Select|Wrap|Line Numbers
  1. <body>
  2. <div id="wrapper">
  3. </div>
  4. </body>
  5.  
Then make a CSS file, or add this to your existing one:
Expand|Select|Wrap|Line Numbers
  1. #wrapper {
  2. width:100%;
  3. height:100%;
  4. }
  5.  
Sep 26 '07 #2
r_o
35
Expand|Select|Wrap|Line Numbers
  1. #wrapper {
  2. width:100%;
  3. height:100%;
  4. }
  5.  
i have tried this and it's not working in both browsers (IE7 and FF 2).the div is like never displayed. since this is inside a frame, i also need that if an element is too large the frame would not overflow but rather become scrollable and its height always fixed.Any suggestions to achieve that ?
thanks
Sep 26 '07 #3
Is the frame an IFrame, and could you possibly post the code your having trouble with?
Sep 26 '07 #4
r_o
35
Is the frame an IFrame, and could you possibly post the code your having trouble with?
sure

[HTML]<frameset rows="16%,4*,*" frameborder="no" border="0" framespacing="0">
<frame src="top.html" name="topFrame" scrolling="no" noresize="noresize" id="topFrame" title="topFrame" marginheight="0" marginwidth="0"/>
<frame src="main.html" name="mainFrame" id="mainFrame" noresize="noresize" title="mainFrame"/>
<frame src="bottom.html" name="bottomFrame" scrolling="no" noresize="noresize" id="bottomFrame" title="bottomFrame" marginheight="0" marginwidth="0" />[/HTML]

problem is with main frame,

[HTML]#wrapper{
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
margin-top:0px;
padding:0px 0px 0px 0px;
width:800px;
height:100%;
display:block;
}
-->
</style>
</head>

<body>
<div id="wrapper">

</div>
</body>
</html>[/HTML]

the div does not take up space inside the frame, and if i put a table inside it, at a certain point of increasing the height of the table, the div just goes out of bound
Sep 26 '07 #5
I'm still not 100% sure about the problem you have because with your code, the div is there in the frame and you can place anything in it and it doesn't disappear.
About the overflow thing, you can try different things to see what you are after.
Here they are:
Expand|Select|Wrap|Line Numbers
  1. overflow:scroll;
  2. overflow:hidden;
  3. overflow:visible;
  4. overflow:auto;
  5. overflow:inherit;
  6.  
And you said you wanted the div to take up all the space, then you should have both the height and width set to 100%.
Sorry I couldn't be of much help
Sep 26 '07 #6
r_o
35
I'm still not 100% sure about the problem you have because with your code, the div is there in the frame and you can place anything in it and it doesn't disappear.
About the overflow thing, you can try different things to see what you are after.
Here they are:
Expand|Select|Wrap|Line Numbers
  1. overflow:scroll;
  2. overflow:hidden;
  3. overflow:visible;
  4. overflow:auto;
  5. overflow:inherit;
  6.  
And you said you wanted the div to take up all the space, then you should have both the height and width set to 100%.
Sorry I couldn't be of much help

yeah for now the div is empty.No matter weither the div is empty or not, i want it to be uniformly displayed, even if the elements inside it are "big" enough to overflow so it would always occupy the same size.
Sep 26 '07 #7

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

7 posts views Thread by xmp333 | last post: by
2 posts views Thread by RWD | last post: by
5 posts views Thread by Martin Chen | last post: by
4 posts views Thread by sumitha | last post: by
1 post views Thread by XIAOLAOHU | last post: by
reply views Thread by MichaelMortimer | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.