zachary Posted July 24, 2008 Share Posted July 24, 2008 Hi,I am having some issues with my template:http://runetomb.com/rsrush/As you can see the left column won't grow with the content column, and I need it to grow with eachother, But I want it to be able to grow down, and not have to have the height of the columns auto set. But I also need to make sure if the left column is taller then the content column that the content column will grow to match the leftcolumn. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Index - RuneScape Rush</title><style type="text/css">body{margin:0;padding:0;line-height: 1.5em;background-image: url('bg.png');background-repeat: repeat-z;}#maincontainer{width: 840px; /*Width of main container*/margin: 0 auto; /*Center container on page*/}#topsection{/* The Height of the header - DO NOT CHANGE */height: 110px;/* Header borders */border: 1px solid #000000;border-top: 0;/* Header Image Must Be (Height: 109px, Width: 838 PX) */background-image: url('blend.png');background-repeat: repeat-x;}#topsection h1{margin: 0;padding-top: 15px;}#contentwrapper{float: left;width: 100%;}#contentcolumn{margin-left: 200px; /*Set left margin to LeftColumnWidth*//* Content Column borders */border-right: 1px solid #000000;border-bottom: 1px solid #000000;background-color: #FFFFFF;}#leftcolumn{float: left;width: 200px; /*Width of left column*/margin-left: -840px; /*Set left margin to -(MainContainerWidth)*/background: #C8FC98;/* Left Column borders */border: 1px solid #000000;border-top: 0;}#footer{clear: left;width: 100%;background: black;color: #FFF;text-align: center;padding: 4px 0;}#footer a{color: #FFFF80;}.innertube{margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/margin-top: 0;}</style><script type="text/javascript">/*** Temporary text filler function. Remove when deploying template. ***/var gibberish=["Demo"]function filltext(words){for (var i=0; i<words; i++)document.write(gibberish[Math.floor(Math.random()*1)]+" ")}</script></head><body><div id="maincontainer"><div id="topsection"></div><div id="contentwrapper"><div id="contentcolumn"><div class="innertube"><script type="text/javascript">filltext(60)</script></div></div></div><div id="leftcolumn"><div class="innertube">GAH HELP ME W3SCHOOLS!</div></div><div id="footer">© 2008 RuneScape Rush. All rights reserved.</div></div></body></html> Link to comment Share on other sites More sharing options...
Kingy Posted July 24, 2008 Share Posted July 24, 2008 If you learn some basic CSS maybe you can set how those boxes will behave with layout changes like max widths or max heights with percentages. Link to comment Share on other sites More sharing options...
zachary Posted July 24, 2008 Author Share Posted July 24, 2008 If you learn some basic CSS maybe you can set how those boxes will behave with layout changes like max widths or max heights with percentages.If I could have figured it out I wouldn't have posted here Can anyone help me? Link to comment Share on other sites More sharing options...
Ingolme Posted July 24, 2008 Share Posted July 24, 2008 In general, you put the div that's supposed to be biggest inside the div with less content to make the divs expand at the same rate. The min-height property can solve the problem if the box is too small. Link to comment Share on other sites More sharing options...
zachary Posted July 24, 2008 Author Share Posted July 24, 2008 I did the min-height thing but my issue is that it will still grow if it gets past the min height and I can't devise a solution so both columns will go to the same height, I might just do a table layout in a second... Link to comment Share on other sites More sharing options...
zachary Posted July 24, 2008 Author Share Posted July 24, 2008 I did the min-height thing but my issue is that it will still grow if it gets past the min height and I can't devise a solution so both columns will go to the same height, I might just do a table layout in a second...I'm going to do a table-layout... Link to comment Share on other sites More sharing options...
Synook Posted July 25, 2008 Share Posted July 25, 2008 ! Don't give up yet.Are you thinking of something like http://roundeddesign.com/lab/rdtech/? Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.