ColMatrix 0 Posted January 21, 2006 Report Share Posted January 21, 2006 Hi I am currently having trouble on how to control the height of a <div> tag.I have <div> tags seperating the page. I want the left <div> to increase its height...no matter how far the content (<div> which is to the right of the left <div>) go to the bottom...but without going too far to make the vertical scroll bar appear (IN the left <div> is a <list> tag for navigation purposes).Some tests:value-Auto...only makes the div go just past the <list> tag.value-100% does not extend when the page extends (due to content)value-em will chnage too far when I increase the text or wont extend with the content.I need it ro resize with the browser aswell, eg 800x640 and 1024x768 but to grow with the <div> on the right (content).Hope that explains the issues, Any help, suggestions would be much appreciated!Col Quote Link to post Share on other sites
Err 10 Posted January 25, 2006 Report Share Posted January 25, 2006 <style type="text/css">div { height: 500px;}</style><div>Div Content</div> OR <div style="height: 500px;">Div Content</div> Quote Link to post Share on other sites
ColMatrix 0 Posted January 25, 2006 Author Report Share Posted January 25, 2006 Thx for replying, The problem I would still have, is when the user changes their screen resolution, The left div would stay at 500px heigh, and not an 600px or 1024px (depending on user res) I have tried in % and it not work...and if I use ems it not change anyway and gets bigger (too big) or smaller when I enlarge the text...Any ideas?Cheers Col Quote Link to post Share on other sites
Err 10 Posted January 26, 2006 Report Share Posted January 26, 2006 Have you tried using Tables? It could help reslove that issue. Just a thought Quote Link to post Share on other sites
jorge 0 Posted January 26, 2006 Report Share Posted January 26, 2006 Could it be resolved using the "overflow" property in the div? There is an example of how it works in this url:http://www.w3schools.com/css/tryit.asp?fil...trycss_overflow Quote Link to post Share on other sites
~Shinta 0 Posted January 26, 2006 Report Share Posted January 26, 2006 Percentages are the way to do it. Quote Link to post Share on other sites
johnmendel 0 Posted January 27, 2006 Report Share Posted January 27, 2006 depending on user resolution is something which i looked into when i started. you could use the screen, i believe, item for IE. I think i might also work in FF. my java script is horrible, but it would look something in this nature. /* returns a boolean */<script type=javascript>function isSmall(){ return (screen.height < 768);}</script>then, (watch me really kill this code)<script type=javascript>function chooseCSS(){ if isSmall() somehow link that css sheet for under 768. I know its possible else /*their res height is 768 or more*/ include the sheet for over 768}</script> I missed alot of the magic inbetween, but thats the basic concept. BTW, you run chooseCSS on body's load. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.