CSS layout headache

  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

Hi

Im having a layout dilemma. Id appreciate some advice/help on this.

Ok heres my page:
http://cms-stu-iis.gre.ac.uk/db810/gsradio/index.htm

Heres the CSS for the page:
http://cms-stu-iis.gre.ac.uk/db810/gsra ... layout.css

OK here's my question:

How do I get the containers 'content' and 'title_middle' to move to the left so that the gap between the content and the navigation and also the logo and the middle bit of the title bar is closed and secondly,

I want to solve this problem very urgently.

All your help is greatly appreciated.

:D
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • gsv2com
  • Professor
  • Professor
  • User avatar
  • Posts: 776
  • Loc: Nippon

Post 3+ Months Ago

To fix the space between the links, specify the width of the "a" tag.

Chage this:

Code: [ Select ]
#navigation a {
display: block;
color: #FFF;
background-color: #036;
padding: .2em .8em;
text-align:center;
}
  1. #navigation a {
  2. display: block;
  3. color: #FFF;
  4. background-color: #036;
  5. padding: .2em .8em;
  6. text-align:center;
  7. }


Into this:
Code: [ Select ]
#navigation a {
display: block;
width:150px;
color: #fff;
background: #036;
padding: .2em .8em;
text-align:center;
}
  1. #navigation a {
  2. display: block;
  3. width:150px;
  4. color: #fff;
  5. background: #036;
  6. padding: .2em .8em;
  7. text-align:center;
  8. }


I'm pretty sure that should fix the links. When you specify block for a link element using the list method for links (bravo btw) you always need to specify the width or else you get those spaces. You may need to decrease the width from 150px to something a little smaller though since you've specified the padding. I haven't dinked around with it, so try both ways. Hope this helps.
  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

Yes Ive tried it but it still doesnt close the gap between the left colums and the middle columns. The left columns are absolute while the middle is relative so I thought that the middle columns should just expand to fill the gaps but this hasnt happened. I changed it as you said, and now Ive taken the padding off, it still has a gap there!

I want the gap between the left columns and the middle columns to be 10px.

Thanks for your help.
  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

Aw cmon there must be someone here that can help!
  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

Its cool guys Ive found the answer.
  • gsv2com
  • Professor
  • Professor
  • User avatar
  • Posts: 776
  • Loc: Nippon

Post 3+ Months Ago

Post it!
  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

Sure thing. I went onto this other forum thats specifically for CSS and got my answer there!

Read all about it:

http://www.csscreator.com/css-forum/ftopic4714.html

Thanks for the help though.

Wondering if you could help me out on this other problem Im having:

http://www.csscreator.com/css-forum/ftopic4718.html

Peace.
  • puKKa
  • Proficient
  • Proficient
  • User avatar
  • Posts: 274
  • Loc: Sweden

Post 3+ Months Ago

A tip on the page, ad a table or something in the main window or do something else so that the text dosnt toucht the edges of the "mainwindow", you understand what I mean?
  • Uzzo
  • Graduate
  • Graduate
  • Uzzo
  • Posts: 136
  • Loc: London

Post 3+ Months Ago

You mean the main content? The gibberish written in the middle in light grey?

I was wondering how you do that through CSS.

Post Information

  • Total Posts in this topic: 9 posts
  • Users browsing this forum: No registered users and 60 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.