Faux columns

  • Danny1337
  • Student
  • Student
  • Danny1337
  • Posts: 70
  • Loc: Norway

Post 3+ Months Ago

I haven't coded anything in a while, and I forgot how to do the easiest things lol. The problem is stretching the div's at the left and right along with the content in the div in the middle.
here's an example i made (i don't know why i cant post links, just change <dot> into a dot . )
http://leetcake <dot> net/retro1/

I need the left and right to stretch down to the footer, regardless of the content in the middle.

  • mk27
  • Proficient
  • Proficient
  • User avatar
  • Posts: 334

Post 3+ Months Ago

You have to give .middle a fixed height to do that, eg, 85%. Unfortunately you cannot use a percentage because your header has a fixed pixel size. Either you change that, or you set the height with javascript, eg:
Code: [ Select ]
   MainDiv = document.createElement('div');

    if (navigator.appName == "Microsoft Internet Explorer") {
             MainDiv.style.height = document.documentElement.scrollHeight-250;
    } else {
        MainDiv.style.height = document.body.scrollHeight-250;
  1.    MainDiv = document.createElement('div');
  2.     if (navigator.appName == "Microsoft Internet Explorer") {
  3.              MainDiv.style.height = document.documentElement.scrollHeight-250;
  4.     } else {
  6.         MainDiv.style.height = document.body.scrollHeight-250;
  7.     }

will work. However, you must create the element using DOM methods (createElement) -- you cannot set the height of an existing element found with getElementById(). Ie, if you have not used DOM before, "MainDiv" has NO corresponding html in the page. It is created entirely from nothing in the js. If you want it inside another div that is in the html, you need to getElementById for that div and appendChild. IMPORTANT: you will not get the height correct if you do this in a script called from <head>. The page must load first, so you call the script at the end of the <body>.

You don't need to set all the style that way, you can:
Code: [ Select ]

Just don't have a "height" component in the css code.

Pretty sure this is only possible using javascript, so if you don't want to go that route you have to assign everything a percentage (eg, your header is 15% offset 5%, the .middle is 75% offset 20%).
  • Richardson06
  • Born
  • Born
  • Richardson06
  • Posts: 1

Post 3+ Months Ago

The information in this post of the forum seems to be quite interesting.

The web designing is also strategy of the SEO services which would be used to create the website of an company and promote the company website.

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 27 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum

© 1998-2017. Ozzu® is a registered trademark of Unmelted, LLC.