Topic: Height issues ad infinitum (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=27804" title="Pages that link to Topic: Height issues ad infinitum (Page 1 of 1)" rel="nofollow" >Topic: Height issues ad infinitum <span class="small">(Page 1 of 1)</span>\

 
SPyX
Bipolar (III) Inmate

From: College Station, TX
Insane since: Aug 2002

IP logged posted posted 04-18-2006 22:34 Edit Quote

First the good news: I've been hired by a web design company here in town. (Do me a favor and DON'T look at their portfolio. I've only been here a month ) I'm working on my first full design for them and I fear I may have gone a bit too ambitious.

The concept.

The main content part i want to be elastic while the other three columns are static widths. I need basically all columns to extend to 100% page height, or document height if the content is larger than the page.

The first solution I have worked on.

The second solution is an attempt to implement this.

I'm having obvious problems with both. Have I done myself in? Any helpful pushes will be appreciated.

-SPyX

Edit: Update: I'm somewhat closer now. I'm just having background image repeat problems. The most offensive of which is the "outer" div.

(Edited by SPyX on 04-19-2006 01:18)

SPyX
Bipolar (III) Inmate

From: College Station, TX
Insane since: Aug 2002

IP logged posted posted 04-19-2006 02:01 Edit Quote

Well, I found a javascript solution. The only drawback is that it seems to crash IE if the window is resized small enough.

synax
Maniac (V) Inmate

From: Cell 666
Insane since: Mar 2002

IP logged posted posted 04-19-2006 23:01 Edit Quote

http://www.alistapart.com/articles/fauxcolumns/

SPyX
Bipolar (III) Inmate

From: College Station, TX
Insane since: Aug 2002

IP logged posted posted 04-20-2006 16:16 Edit Quote

Well, aquainted. There were too many background images to make that possible.

divinechaos
Nervous Wreck (II) Inmate

From:
Insane since: Dec 2001

IP logged posted posted 04-21-2006 08:04 Edit Quote

Best javascript solution:
http://www.projectseven.com/tutorials/css/pvii_columns/index.htm

Best pure CSS solution:
http://positioniseverything.net/articles/onetruelayout/

Cheers,
DC

SPyX
Bipolar (III) Inmate

From: College Station, TX
Insane since: Aug 2002

IP logged posted posted 04-21-2006 19:53 Edit Quote

The code I'm currently using seems much less bloated.

code:
function resize(){  
var frame = document.getElementById("sidebar");  
var htmlheight = document.body.parentNode.scrollHeight;  
var windowheight = window.innerHeight;  
if ( htmlheight < windowheight ) { document.body.style.height = windowheight + "px"; frame.style.height = windowheight + "px"; }  
else { document.body.style.height = htmlheight + "px"; frame.style.height = htmlheight + "px"; }  
}



Post Reply
 
Your User Name:
Your Password:
Login Options: Remember Me On This Computer
 
Your Text:
Loading...
Options: Show Signature
Enable Slimies
Enable Linkwords

« BackwardsOnwards »

Show Forum Drop Down Menu