Horizontal Navigation list problems

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Locked
vivlonsdale

Horizontal Navigation list problems

Post by vivlonsdale »

Hi there,

This is my first post and also my first installation of this CMS. The backend management is great and I love using it. But I’m having problems getting the horizontal navigation to work how I want it to.

I’ve been able to tweak things (not to much) so that its looks as I wanted it to but for some reason I don’t know how to:

A) Close the gap between the ‘film strip’ of images at the top of the page and the horizontal navigation strip

B) Get the horizontal navigation to expand fully horizontally. What I mean is so that Home is flush to the left and Contact Us is is flush to the right hand side

Due to time constraints for qa last minute project I’m using all the original styles sheets ans style names that came with it at install. I’ve only change the colours and borders.

ANY help would be GREATLY  ;D recived.

The website is available to view here…
http://www.thecityacademy.co.uk/index.php?page=home

Regards

Viv
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12709
Joined: Thu Mar 09, 2006 5:32 am
Location: Arizona

Re: Horizontal Navigation list problems

Post by Dr.CSS »

Try  " div#container{margin-top: 123px} " w/o quotes

hth    mark
vivlonsdale

Re: Horizontal Navigation list problems

Post by vivlonsdale »

Tried that and its not worked. It's moved the top down

http://www.thecityacademy.co.uk/index.php?page=home

Woudl it help if I posted the styles? ???
Last edited by vivlonsdale on Wed Mar 22, 2006 11:53 pm, edited 1 time in total.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12709
Joined: Thu Mar 09, 2006 5:32 am
Location: Arizona

Re: Horizontal Navigation list problems

Post by Dr.CSS »

This worked fine, just adjust it to suit your needs.

/* NAV BAR AT THE TOP AND ONE COLUMN OF CONTENT */

    div#content {
        width: 96%;
        margin: 0;
        padding: 1em 2%;
        text-align: left;
    }

    div#main {margin-top:120px

    }

    div#menu_horiz {
        width: 100%;
        text-align: left;
        border-top:2px solid #395639E;
        border-bottom:2px solid #95639E;
    }

/* END CONTENT */

HTH  ;)  mark
Locked

Return to “Layout and Design (CSS & HTML)”