Page 1 of 1

css tutorial on auto resizing page

Posted: Sat Jul 14, 2007 12:44 am
by izzysanime
HI,

I always wanted to know how those sites designs that can auto resize the height work?  Does anyone have any links?

thanks
Josh

Re: css tutorial on auto resizing page

Posted: Sat Jul 14, 2007 5:25 am
by Kayin
what?

Re: css tutorial on auto resizing page

Posted: Sat Jul 14, 2007 8:04 am
by Bobonov
I think you mean a web site that always get full height even if the content stop at half of the page, that mean that the footer goes always at the bottom of the page.

In this page you can fine several example on how to do it
http://www.maxdesign.com.au/presentation/page_layouts/

Re: css tutorial on auto resizing page

Posted: Sat Jul 14, 2007 8:15 am
by Deblus
that is an excellent site for learners thanks for sharing  8)

Re: css tutorial on auto resizing page

Posted: Sat Jul 14, 2007 8:25 am
by RonnyK
Check the following link for some examples, scroll down to see more if you just want headers or footers, the URL is for both header and footer.

http://limpid.nl/lab/css/fixed/header-and-footer

Ronny

Re: css tutorial on auto resizing page

Posted: Sun Jul 15, 2007 7:03 pm
by izzysanime
umm, i dont think thats what i mean.  I mean for an image based site, with a page that stays with the content, if there is 1 paragraphs the footer / sides stay with the 1, if their are 5 paragraphs, the site opens up for it.  I have seen sites like the way mine is, where the content is, its just a white background under an image, so when content grows that is no problem, but there are sites that have 2 sides on the left and right of the content, so how do you get that to stretch with the content?  does that make sense.

this site is the first that comes to mind http://mbta.com/, see how the border is there as well.

thanks
Josh

Re: css tutorial on auto resizing page

Posted: Sun Jul 15, 2007 7:45 pm
by Bobonov
does that make sense.
Beeing honest I am more confused now than after your first post...
I mean for an image based site
Do you mean background?
With a page that stays with the content, if there is 1 paragraphs the footer / sides stay with the 1, if their are 5 paragraphs, the site opens up for it.
Normally every site stretch vertically when contents grow, this is the normal behavior of the browser unless you specify differently in the css
I have seen sites like the way mine is, where the content is, its just a white background under an image, so when content grows that is no problem, but there are sites that have 2 sides on the left and right of the content, so how do you get that to stretch with the content?
As  I said unless you put some rules in the css this is the normal behavior, the default installation of CMSMS works like this

Re: css tutorial on auto resizing page

Posted: Sun Jul 15, 2007 8:01 pm
by izzysanime
LOL, ok, when i make a sites template using css that has images in the design, i use imageready with slices, export it with something like absolute positioning.  When i add content to the content area, which is usually plain white, the top and bottom are fine, but the left and right part of the page that where perfect when the content could fit are now hanging in the center of the div or table, in other words their is now white space between the top and bottom that was not there when the content could fit. 

like on the MBTA.com site that i linked you to, the left and right parts of the page automatically resize based on the content.

thanks,
Josh

Re: css tutorial on auto resizing page

Posted: Sun Jul 29, 2007 3:14 am
by Dr.CSS
Those are more than one template with a mix of divs and table layout, just the main white area has a diff. setup, make one with the main empty then copies to make main changes...

Like these... wireframes...

http://themes.cmsmadesimple.org/Theme_Frameworks.html

Re: css tutorial on auto resizing page

Posted: Tue Jul 31, 2007 12:10 am
by Lexy
hi everyone newb hr...nice to meet you all... :D

Re: css tutorial on auto resizing page

Posted: Fri Dec 14, 2007 7:51 am
by dsims
would overflow:scroll; help