Newbie CSS layout question

[Jason]

Hi

I'm making a design that will be applied to hundreds of pages, so
trying to use CSS with DIVS and no tables to control the layout.

In my example, the left DIV section (the title and text) is floated to
the left. Is there any way to make it stretch to the bottom of the
main DIV without fixing the height? I'd like to lose the white space
below.

http://www.bluetattoo.co.uk/csstest/test.htm

Any advice appreciated!

Thanks, Jason

 

[brucie]

In alt.html Jason said:

In my example,

YAY! someone actually supplied a URL for a change. you get a gold star
to attach to your forehead.

the left DIV section (the title and text) is floated to
the left. Is there any way to make it stretch to the bottom of the
main DIV without fixing the height? I'd like to lose the white space
below.
http://www.bluetattoo.co.uk/csstest/test.htm

http://nemesis1.f2o.org/articles

 

[brucie]

In alt.html brucie said:

http://nemesis1.f2o.org/articles

better link:
http://www.maxdesign.com.au/presentation/page_layouts/index.cfm

 

[brucie]

In alt.html brucie said:

better link:
http://www.maxdesign.com.au/presentation/page_layouts/index.cfm

and some more

layout examples:
http://www.glish.com/css/
http://www.csszengarden.com/
http://www.bookofstyles.org/
http://tantek.com/CSS/Examples/
http://www.saila.com/usage/layouts/
http://www.bluerobot.com/web/layouts/
http://www.benmeadowcroft.com/webdev/
http://nemesis1.f2o.org/templates.php
http://www.xs4all.nl/~apple77/columns/
http://www.meyerweb.com/eric/css/edge/
http://www.htmler.org/tutorials/3/1.html
http://css.nu/articles/floating-boxes.html
http://webhost.bridgew.edu/etribou/layouts/
http://www.roguelibrarian.com/lj/index.html
http://css-discuss.incutio.com/?page=CssLayouts
http://ecoculture.com/styleguide/r/rollovers.html
http://thenoodleincident.com/tutorials/box_lesson/index.html
http://www.webreference.com/authoring/style/sheets/layout/advanced/

 

[brucie]

In alt.html brucie said:

better link:
http://www.maxdesign.com.au/presentation/page_layouts/index.cfm

what the hell, heres the whole shebang

css tutorials and other fun 'n giggly css stuff:
http://www.css.nu/
http://www.mako4css.com/
http://www.richinstyle.com/
http://www.blazonry.com/css/
http://www.w3schools.com/css/
http://www.websitetips.com/css/
http://www.htmlhelp.com/reference/css/
http://www.mezzoblue.com/css/cribsheet/
http://www.pageresource.com/dhtml/indexcss.htm
http://www.webpageworkshop.co.uk/main/css_index
http://old.climbtothestars.org/coding/cssbasic/
http://www.htmlcenter.com/tutorials/index.cfm/css/
http://www.freewebmastertips.com/php/content.php3?aid=48
http://www.canit.se/~griffon/web/writing_stylesheets.html
http://www.utoronto.ca/ian/books/xhtml2/exerpt/css-4a.html
http://www.greytower.net/en/archive/articles/tsutsumi.html
http://www.intranetjournal.com/articles/200101/csstutorial1a.html
http://webmonkey.com/authoring/stylesheets/tutorials/tutorial1.html

layout examples:
http://www.glish.com/css/
http://www.csszengarden.com/
http://www.bookofstyles.org/
http://tantek.com/CSS/Examples/
http://www.saila.com/usage/layouts/
http://www.bluerobot.com/web/layouts/
http://www.benmeadowcroft.com/webdev/
http://nemesis1.f2o.org/templates.php
http://www.xs4all.nl/~apple77/columns/
http://www.meyerweb.com/eric/css/edge/
http://www.htmler.org/tutorials/3/1.html
http://css.nu/articles/floating-boxes.html
http://webhost.bridgew.edu/etribou/layouts/
http://www.roguelibrarian.com/lj/index.html
http://css-discuss.incutio.com/?page=CssLayouts
http://ecoculture.com/styleguide/r/rollovers.html
http://thenoodleincident.com/tutorials/box_lesson/index.html
http://www.maxdesign.com.au/presentation/page_layouts/index.cfm
http://www.webreference.com/authoring/style/sheets/layout/advanced/

some sites using css layouts:
http://www.inc.com/
http://www.wired.com/
http://www.opera.com/
http://www.kitty5.com/
http://www.cinnamon.nl/
http://msn.espn.go.com/
http://www.virtuelvis.com/
http://www.emptybottle.org/
http://www.fastcompany.com/
http://www.littleyellowdifferent.com/
http://www.pga.com/pgachampionship/2004/

rounded corners:
http://www.albin.net/CSS/roundedCorners/
http://www.alistapart.com/articles/customcorners/
http://www.guyfisher.com/builder/workshop/css/corners/

slants: http://www.infimum.dk/HTML/slantinfo.html
lists: http://www.alistapart.com/articles/taminglists/
pure css menus: http://www.meyerweb.com/eric/css/edge/menus/demo.html
Fast rollovers: http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/

centering thingys
http://dorward.me.uk/www/centre/
http://www.w3.org/Style/Examples/007/center.html
http://www.student.oulu.fi/~laurirai/www/css/middle/
http://hicksdesign.co.uk/articles/css/vertical_centering_with_css/

master compatibility charts:
http://centricle.com/ref/css/filters/
http://www.blooberry.com/indexdot/css/index.html
http://macedition.com/cb/resources/abridgedcsssupport.html
old:
http://www.immix.net/html/CSSGuide.htm
http://devedge.netscape.com/library/xref/2003/css-support/

hiding CSS from crappy browsers:
http://diveintomark.org/safari/csshacks/
http://www.ericmeyeroncss.com/bonus/trick-hide.html
http://www.w3development.de/css/hide_css_from_browsers/

deadtree quick refs: http://visibone.com/html/

css checkers:
http://jigsaw.w3.org/css-validator/
http://www.htmlhelp.com/tools/csscheck/
http://examples.tobyinkster.co.uk/checkers

cascading style sheets, level 2 specification
http://www.w3.org/TR/REC-CSS2/
cascading style sheets, level 2 revision 1 Candidate Recommendation
http://www.w3.org/TR/CSS21/

 

[Jason]

Thanks Brucie - that's really helpful.

I'm now using a background image with the main DIV and everything
works fine in IE. Firefox doesn't like it though - the content spills
over the edge of my DIV tag.

Example: http://www.bluetattoo.co.uk/csstest/test.htm

Now I'm totally confused... any suggestions welcomed!

Thanks,
Jason

 

[brucie]

In alt.html Jason said:

Thanks Brucie - that's really helpful.

goody but please don't toppost, it upsets the little voices.

How am I supposed to post my replies in a newsgroup?:
http://allmyfaqs.com/faq.pl?How_to_post

I'm now using a background image with the main DIV and everything
works fine in IE. Firefox doesn't like it though - the content spills
over the edge of my DIV tag.
Example: http://www.bluetattoo.co.uk/csstest/test.htm

http://moreshit.usenetshit.info/image-right-with-full-height-border-thingy.shit