css masters look here!
- Started
- Last post
- 12 Responses
- leftwave
i'm starting a new thread on this subject, because i have a new approach...but am open to any ideas at this point to accomplish what i'm trying to do.
i'm fairly new to css and have this site i'm working on:
http://leftwave.com/indevelopmen…my goal is to have the section "from the ranch to the coast" expand vertically to accommodate for any amount of text in this box. but, i always want the "prudential" box to stay at the bottom of the page.
i tried using this:
http://www.projectseven.com/tuto…but can only get it to work when there is a little bit of text on the page. when the text gets long, here is what happens:
http://leftwave.com/indevelopmen…
note the large empty space between "read more" and the golf flag. i suspect this has to do with the height from the top navigation/image, but don't know how to prevent this.the first person who can solve this will be my hero!!!!!
- TResudek0
Not familiar with that method but can you add float:left to each of the DIVs on the right(box1Rsub,dividerR,box3R) and report the results?
- interesting. this works with a lot of content, but doesn't stretch vertically with minimal content.....leftwave
- however, the padding-right doesn't work (?): http://leftwave.com/…leftwave
- tparsons0
Looks like a possible margin or padding issue on the bottom of your paragraph text.
Also looks like you're trying to create a footer that stays on the bottom. This might help http://ryanfait.com/sticky-foote…
- Mellimelvin0
if you float the divs on left and right you'll need to clear them after the closed </div> for the right float.
You can clear it with a <br style="clear: both;" />. This should bring both columns to the bottom and expand evenly when you add or subtract copy.
- visionary0
float the divs. exactly what I was thinking.
- Gordy220
you could use a clearfix as well.
Google it - keeps your html valid (but dont think the CSS validates)
- acescence0
fix your tag mismatches first...
- bulletfactory0
I think I'm close....
example with longer content
http://bulletfactory.com/dev/tes…example with short content
http://bulletfactory.com/dev/tes…
- airey0
i don't understand the issue? if it's correctly made with div floats it could be any height and make no difference to the layout.
- leftwave0
i beg you people. can someone please SHOW me how to do this without fancy javascripts and only floating the divs? (i'm a css newbie so go easy please)
- falcons_allies0
Set the information you want to stick to the bottom in a #footer and align it bottom... see this.
http://boagworld.com/technology/…- not sure how to use this since the #footer isn't really outside of the #content, it's next to itleftwave
- JamesBoynton0
Also the way youve done it in the example 4 posts back has problems when you adjust the text size.
- JamesBoynton0
Also, sorry to say but the site completely falls apart in ie6 which i imagine will be a problem, and in ie7 the background pattern behind the text only extends to the bottom of the text, ive taken a look at your css but to be honest its pretty hard to work out what is going on. I would probably start the css part again if it were me. Sorry i cant be of more help, need to get back to work.
- Also pretty broke in ie8!JamesBoynton
- yeah, i'd call a complete redo myself. or pay someone and see what they did.airey