Jump to content
Sign in to follow this  
zachary

Ahh.. annoying error

Recommended Posts

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>

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites
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?

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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...

Share this post


Link to post
Share on other sites
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...

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...