Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 03-06-2013, 11:40 PM   PM User | #1
dalep282
New to the CF scene

 
Join Date: Mar 2013
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
dalep282 is an unknown quantity at this point
CSS issue & design feedback!

Hello,

I was wondering if anyone can offer any help for a learning website that I am designing a template for...

http://new.learnhigher.ac.uk/template.html

In particular, I cannot seem to get the page wrapper, or footer divs to extend to the hight of the page. Tried lots of things but it doesn't seem to make any difference. (screenshot of the issue here: http://bit.ly/108Beg3 )

if you have any other design advice - what is good, or what could be improved - do let me know. am open to ideas...

Many thanks for your help in advance :-)
dalep282 is offline   Reply With Quote
Old 03-07-2013, 05:38 AM   PM User | #2
Arbitrator
Senior Coder

 
Arbitrator's Avatar
 
Join Date: Mar 2006
Location: Splendora, Texas, United States of America
Posts: 2,887
Thanks: 5
Thanked 186 Times in 183 Posts
Arbitrator is on a distinguished road
Quote:
Originally Posted by dalep282 View Post
In particular, I cannot seem to get the page wrapper, or footer divs to extend to the hight of the page.
To remove the space between #nav and #wrapper, remove the top margin from #content. This margin is collapsing through #wrapper's top border and creating the gap you're seeing. (Perform a Web search for "CSS margin collapsing" if interested in the concept.)

To deal with the space above #footer, first I would do something that isn't directly related to avoid later confusion: set overflow: auto on #content so that #content fully encapsulates #content-right-container and #content-left (which both have a non-default float property value). (To understand the hanging float concept, you can read the first two sections of the article Clearing Floats (i.e., the intro section and "Understanding the Problem").)

The above will cause your height: 0 declaration on #content to become meaningful (and screw up the layout). Delete that. It will also cause you the bottom padding on #content to materialize. Set that to 0 unless you want that 12 pixels of space.

Once you've done that, simply remove the bottom margin from #content-left.
__________________
Please for the love of god stop making IE. You current "browser"s cause me to cry every day. —Phil *
Arbitrator is offline   Reply With Quote
Old 03-07-2013, 05:49 AM   PM User | #3
Arbitrator
Senior Coder

 
Arbitrator's Avatar
 
Join Date: Mar 2006
Location: Splendora, Texas, United States of America
Posts: 2,887
Thanks: 5
Thanked 186 Times in 183 Posts
Arbitrator is on a distinguished road
Hmm... I forgot to comment on the design aspect.

Quote:
Originally Posted by dalep282 View Post
if you have any other design advice - what is good, or what could be improved - do let me know. am open to ideas...
Regarding your design, I would consider the concept of "proximity," and group related content more closely together. Your headings in the right-hand column should have less space beneath them to visually associate them with their content below. And your table rows could have less space in between them to make the tabular data visually seem like more of a unit.

I'd also consider "contrast". In your navigation bar, you use bold text, but the contrast between the surrounding (non-bold) text is so poor that the effect is lost. The bold text needs more emphasis. Plus you have gold text on a white background. You might consider using CSS text shadows if you're enamored to that color combination.
__________________
Please for the love of god stop making IE. You current "browser"s cause me to cry every day. —Phil *
Arbitrator is offline   Reply With Quote
Old 03-07-2013, 06:07 AM   PM User | #4
hofik.tuhin0011
New to the CF scene

 
Join Date: Mar 2013
Location: Dhaka,Bangladesh
Posts: 1
Thanks: 1
Thanked 0 Times in 0 Posts
hofik.tuhin0011 is an unknown quantity at this point
First time i join this site .I want very strong html,css,php.So i want help and suggestion very body.
hofik.tuhin0011 is offline   Reply With Quote
Old 03-08-2013, 12:11 AM   PM User | #5
dalep282
New to the CF scene

 
Join Date: Mar 2013
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
dalep282 is an unknown quantity at this point
Thanks a lot for those pointers Arbitrator. Am working through them and will let you know how I get on...

Thanks again!
dalep282 is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

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 +1. The time now is 04:36 PM.


Advertisement
Log in to turn off these ads.