Ida Posted May 9, 2006 Share Posted May 9, 2006 (edited) Can anyone help me please.I need to get a container to expand (like a table does) in height when the content expands. Is this possible? It looks fine in IE but not in Firefox and Opera. It is the menu that is placed in the layoutContainer that continues outside the layoutConainer. You can see how it looks now here: http://www.visioni2i.se/ida/om_kristallforum.htmlHere is the css code: /* --------Layout------ */#container { width: 750px; MARGIN-LEFT: auto; MARGIN-RIGHT: auto; } #bgTopShadow { float:left; width: 750px; height: 7px; background:url(top_shadow.gif) no-repeat; background-position: bottom left;}#middleContainer { float:left; width: 750px; height:100%; vertical-align: top; background-color:#FFFFFF; } #bgLeftShadow { float:left; width: 7px; height: 424px; background:url(left_shadow.gif) repeat-y; } #bgStartLeft { float:left; width: 430px; height: 424px; background:url(bg_start.gif) repeat-x; padding:0px; }#bgStartRight { float:left; width: 306px; height: 424px; background:url(krona_start.jpg) no-repeat; }#bgRightShadow { float: left; width: 7px; height: 424px; background: url(right_shadow.gif) repeat-y; } #bgBottomShadow { float: left; width: 750px; height: 7px; background:url(bottom_shadow.gif) no-repeat; } #introtext { width: 350px; position:relative; top: 40px; padding: 0; margin: 0 auto; } #logoStart { margin: 0 auto; width: 236px; } #erbjudandeStart { float: right; } #bgMenu { float: left; width: 146px; height: 424px; background:url(leftbar.jpg) no-repeat; background-color:#041B5F; padding-left: 20px; padding-right: 20px; padding-top: 90px; } #main { float:left; width: 300px; height: 100%; background-color:#FFFFFF; background-position:bottom right; height:auto; padding-left: 30px; padding-top: 40px; margin: 0; } #boxMenu { float:left; postition: relative; width: 140px; margin: 0 auto; padding-left: 20px; padding-right: 20px; padding-top: 90px; top: 180px; height:auto; } #layoutContainer { float:left; width: 736px; height:auto; background:url(bgLayout.gif) repeat-y; background-position:top; background-color:#FFFFFF; padding-left: 7px; padding-right: 7px; overflow: visible; }#bgOmKristall { float:right; width: 182px; height: 427px; background:url(empire6_oxid.jpg) no-repeat; vertical-align:bottom; background-position:bottom right;} Thanks! Edited May 9, 2006 by Jonas Link to comment Share on other sites More sharing options...
johneva Posted May 9, 2006 Share Posted May 9, 2006 The problem is you have given the bgmenu a set height.This is ok in IE as you say cos it will expand as needed but it shouldnt thats why Firefox and other browsers dont.Thats what min-height is for but IE does not recognise this so you carnt use that either.But I would just remove the set height for bg menu and it will size to fit the content and thats it. Link to comment Share on other sites More sharing options...
Ida Posted May 9, 2006 Author Share Posted May 9, 2006 Tank you so much! Learning something new every day Link to comment Share on other sites More sharing options...
Little Goat Posted May 9, 2006 Share Posted May 9, 2006 or, you could just put overflow:visible;LG Link to comment Share on other sites More sharing options...
johneva Posted May 9, 2006 Share Posted May 9, 2006 No you carnt it still dont expand the div as needed then.Here take a look at the exaple I made to show ya. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>See</title><style>#look { height: 200px; width: 200px; border: medium double #f00; overflow:visible;}</style></head><body><div id="look">noigfnbonods dnfousirvn nerovnoelsnvubn rnvoiuneilnvoiur ntbnornbol neroiunvoirtngob iotrnbonrtb nbirtnmobirtnobir rntoibnrtnb bntrbnortfnob brtnibnortb tgnibtrnbofntob booinbotnrobnt botnboitlb noigfnbonods dnfousirvn nerovnoelsnvubn rnvoiuneilnvoiur ntbnornbol neroiunvoirtngob iotrnbonrtb nbirtnmobirtnobir rntoibnrtnb bntrbnortfnob brtnibnortb tgnibtrnbofntob booinbotnrobnt botnboitlb noigfnbonods dnfousirvn nerovnoelsnvubn rnvoiuneilnvoiur ntbnornbol neroiunvoirtngob iotrnbonrtb nbirtnmobirtnobir rntoibnrtnb bntrbnortfnob brtnibnortb tgnibtrnbofntob booinbotnrobnt botnboitlb noigfnbonods dnfousirvn nerovnoelsnvubn rnvoiuneilnvoiur ntbnornbol neroiunvoirtngob iotrnbonrtb nbirtnmobirtnobir rntoibnrtnb bntrbnortfnob brtnibnortb tgnibtrnbofntob booinbotnrobnt botnboitlb </div></body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now