noob looking for some advice

Evilreg

Evilreg

Evilreg

Associate
Joined
14 Jan 2010
Posts
134
Location
Humberside uk
Hi Guys

Here is what i have been working on this site
Still under construction at the moment but before i blunder ahead with content im having a problem with the footer.

In moz IE and chrome it looks fine but in safari the center div holding the site map strecthes beyond the fixed hight footer. it also does this in all browsers if running at a low screen rez.

have i created my footer incorrectly any assitance would be greatly appreaciated from the gurus here :)

*edit i have also noticed that the links seem to be unafected by the line height that was set for thee footer wrapper
 
Last edited:
for those that are interested im slowly working my way to the bottom of my little problem pardon the pun bottom/footer :) i know its a poor pun.

So after a few hours googling and reading my problem seems to be caused by me not clearing the floats therefore the footerwrapper was no expanding round the 3 divs floated inside.

i also found this which helped me understand a little more about creating footers http://www.cssstickyfooter.com/using-sticky-footer-code.html

im now faced with remaking the footer now slightly differently im still fiddling as i want the text slightly smaller than that of the body but when i set to a 90% size it looks ok in the smaller rez screens but the text in the high rez screens look's tiny so im clearly not getting that right.

its a workinig progress.

thanks to the 66 peeps that took time to look it a shame no one had any comments would be nice to hear some feedback good or bad.
 
I think the reason you never got any replies is that you said the main problem was in Safari. I like to help as much as the next guy, but I wasn't going to install Safari on Win7 and my MBP is on the other side of my flat.

I did shrink my window down and try looking in Firefox, but didn't see anything amiss.

If the problem is just clearing, you could just set a width on your footer and apply overflow:hidden to it. This will automatically make it contain the floats inside of it.
 
Tripnologist said:
If the problem is just clearing, you could just set a width on your footer and apply overflow:hidden to it. This will automatically make it contain the floats inside of it.
Click to expand...

thanks trip il try this i appreaciate u takinig the time to look at it.
is safari not a popular browser? i dont use it much myself just have it installed to check stuff out.
 
I've just taken a look at the html/css for your footer and it needs a bit of help I think.
It looks like you've added a ton of space between everything and then used a really small line-height to try and bring it all back together.

If you've not sorted it out by the time I'm home from work tomorrow, I'll redo it for you.
 
hi guys

i havent uploaded the newer version as of yet i had a little accident with my .dwt and spent most of last night recovering it from what i read so far i think i have been going around my footer the wrong way.

its my understanding of heights and stuff i think which is not helping.

is it better to use % or a fixed pixle size when trying to use set heights on the divs.

Thanks for offering to sort this for me Trip i do appreaciate the offer but appreaciate the feed back much more i will first try to fix this myself but if im unsucsessful its good to know peeps like u are about to help out.
 
Fixed pixel size I always have found the best. I find percentages to be too much of a variable, especially when the length of the page can change with the amount of information you may have on it.

The way I normally size sections of the page in the style of that is:
Top - Fixed
Middle - Usually set a minimum height so that it can expand if needed when there is more content and if there is less then it wont look out of place being a really short page.
Bottom - Fixed

I think that is what you asked anyway.
 
Evilreg said:
is it better to use % or a fixed pixle size when trying to use set heights on the divs.
Click to expand...

You shouldn't really be setting height at all. It's my opinion that you should make all content areas vertically fluid so that it can accommodate any content put into it.

There are exceptions to this of course, like when the design calls for it (though often min-height is sufficient) or when you are completely certain that the content length will never change. Your footer shouldn't require a set height.
 
I was starting to think that the fixed height was one of the reasons i was having problems which you guys have now confirmed thankyou.

Im going to have a re-hash at this tonight. I have used an image for the wrapper background if i set the min-hieght to the hieght of the image and the height for the divs within to auto will the containing divs still streatch out of the wrapper should content allow i assume i should tell the wrapper overflow:hidden.

Fixed pixel size I always have found the best. I find percentages to be too much of a variable,
Click to expand...

i have been witnessing this in my pages and blundering attempts to fix it im actually quit looking forward to getting stuck into this tonight now.

thankyou all for you input
 
Last edited:
Evilreg said:
I have used an image for the wrapper background if i set the min-hieght to the hieght of the image and the height for the divs within to auto will the containing divs still streatch out of the wrapper should content allow i assume i should tell the wrapper overflow:hidden.
Click to expand...

A div's default height is auto, so you don't need to set it for the 3 child divs in your footer.

Just set width, min-height and overflow: hidden on your footer.
 
thanks trip that worked a treat

heres were i am now

im still not 100% happy with the buttons but i didnt mess with them too much

but it checks out in moz, IE, Chrome and now safari it looks a little odd on my iphone im assuming this is because i used a fixed pixle font size but i can live with that.

thanks again guys and i welcome your comments and will update u when i get more content on.
 
You must log in or register to reply here.
Back
Top Bottom