WeLoveCSS Logo
Home Profile Members Search Rules Help New Posts



WeLoveCSS > WEB DESIGN > HTML & XHTML > HTML/CSS page size problem

Reply
  Thread Tools Display Modes
Old 23rd March 12, 04:15 PM   #1
zenoah
WLC Member
 
Join Date: Mar 2012
Posts: 2
Default HTML/CSS page size problem

Hi,

I'm have a XHTML page that has problems with text boxes sitting outside of a main image boundary. The browser window should be able to be resized to fit the background image without scroll bars showing. Instead the text boxes create blank areas outside the image making the scroll bars appear.

The link to the css and xhtml file is below.

Nobody so far can think of a fix.


Thanks,
Anthony

http://db.tt/EUwW2cdf
zenoah is offline   Reply With Quote
Old 23rd March 12, 05:22 PM   #2
chrishirst
Banned
 
Join Date: Jun 2006
Location: Blackp ool U.K.
Posts: 3,196
Default Re: HTML/CSS page size problem

Quote:
I'm have a XHTML page that has problems with text boxes sitting outside of a main image boundary.
Clear your floats.

http://www.quirksmode.org/css/clearing.html
chrishirst is offline   Reply With Quote
Old 24th March 12, 10:35 AM   #3
zenoah
WLC Member
 
Join Date: Mar 2012
Posts: 2
Default Re: HTML/CSS page size problem

Any chance you could expand on that.

Possible example with the code i have?


Thanks
zenoah is offline   Reply With Quote
Old 24th March 12, 11:59 AM   #4
chrishirst
Banned
 
Join Date: Jun 2006
Location: Blackp ool U.K.
Posts: 3,196
Default Re: HTML/CSS page size problem

http://css.maxdesign.com.au/floatutorial/

Floats exist in a plane that is outside of the document flow, where only the content area of the W3c box model is in the normal flow, but the other box components are allowed to 'break out' of the parent container and occupy their 'normal' positions and space.

There are a few ways of preventing this, one is explained in detail in the Quirksmode article the others are:
A: give the last element in the float plane a (clear:left; | right; | bothclear property value that closes the float plane and restores the document flow after the parent element.

B: add an empty "clearing element" usually a line break (<br>) that has the appropriate clear setting (as above).
chrishirst is offline   Reply With Quote
Old 24th March 12, 12:09 PM   #5
chrishirst
Banned
 
Join Date: Jun 2006
Location: Blackp ool U.K.
Posts: 3,196
Default Re: HTML/CSS page size problem

Oh! And by the way, I don't "spoon feed" code to questions that are about the fundamentals of web development using HTML & CSS.
I always presume you have asked because you want to learn what has caused the issue and how to avoid it in the future.
So I show you where you can read explanations and where you can learn the solution for yourself. This is how I aquired my knowledge of CSS, and why I am now on the other side of the equation, answering the questions rather than asking them.

And that is not arrogance or being 'big-headed", it is a simple fact.
chrishirst is offline   Reply With Quote
Old 12th April 12, 09:10 PM   #6
chrishirst
Banned
 
Join Date: Jun 2006
Location: Blackp ool U.K.
Posts: 3,196
Default Re: HTML/CSS page size problem

A rule applied to the ID of an element will override later rules that only apply to the classname.
chrishirst is offline   Reply With Quote
Reply


Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 06:48 PM.



Home | Advertise | Contact Us | Top
Home | Advertise | Contact Us | Top

Copyrightę 2006 WeLoveCSS.com. All Rights Reserved.
Powered by vBulletin Version 3.8.4 Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.