centreret menu med css

Her kan du spørge om hjælp til design, templates og css.

Moderator: b-ronnow

Locked
loke
Joomla! Apprentice
Joomla! Apprentice
Posts: 40
Joined: Mon Jul 09, 2007 7:20 am
Location: Thisted

centreret menu med css

Post by loke » Tue Jun 03, 2008 11:11 am

Hej alle på dette storartede forum.
Jeg har rodet en del med en template fra snek.gr http://demo.snek.gr/index.php?jos_change_template=zeus men jeg har problemer med ar få den horisontale menu centreret, jeg skal kun bruge 3-4 sider på min side og det ser ikke ordentlig ud med så få valg i menu'en når de bliver vist helt ude fra venstre side af. På linket kan i se at snek.gr har 9 valg muligheder, så derfor fylder hans menu næsten hele menu linjen ud, så ser det jo godt nok ud.
Jeg ville gerne have at menuentil at ekspandere fra midten og lige meget ud til hver side ved nye tilføjelser?
Jeg er overbevist om at det er i css filen at det skal rettes, og har prøvet alt hvad jeg kender til css, men intet virker, er der en venlig sjæl her på forumet der kan give min en forklaring og gerne en rettelse til css'en som vil kunne få min menu til at fungere efter mine hensigter?

Jeg smider lige en del af css koden her, jeg er næsten 100% sikker på at det er her der skal rettes.
På forhånd tak for et godt forum.
Mvh. loke

Code: Select all

/*****HYBRID**********/
#horizmenu{
width:980px;
padding:0;
height:25px;
margin:0px auto  ;
}
#contentseparator {
width:980px;
height:24px;
margin:0px auto;
border-top:1px solid #555;
padding:0;

}
#nav {
position: relative;
top:0px;
height:25px;
width:980px;
margin:0;
padding:0;
}
#nav li ul {
margin: 0;
padding: 0;
}
#nav a {
display:block;
text-decoration: none;
}

#nav li { /*float the main list items*/
margin: 0;
float: left;
display: block;
padding:0 5px;
}
#nav li ul {
display: none;
}

#nav li.off ul  { /*put the subnav below*/
position: absolute;
top: 15px;
padding-top:10px;
left: 0;
height:35px;
width:980px;
}

#nav li.on:hover ul, #nav li.over ul { /*for ie*/
}

#nav li a {
float:left;
height:25px;
line-height:25px;
font-weight:normal;
padding:0 10px 0 10px;
display:block;
color:#fff;
text-decoration:none;
}


#nav li.off ul a {
border: 0;
float: left; /*ie doesn't inherit the float*/
color: #fff;
width: auto;
margin:0 5px;
}

#nav li.over ul li a { /*for ie - the specificity is necessary*/
}


#nav li.off:hover ul, #nav li.over ul {
display: block;
z-index: 6000;
}

#nav li.off a:hover{
color: #fff;
background:#156c94;
}

/********************/

Gadensgaard
Joomla! Champion
Joomla! Champion
Posts: 6139
Joined: Sat Nov 18, 2006 12:29 pm

Re: centreret menu med css

Post by Gadensgaard » Tue Jun 03, 2008 7:04 pm

Prøv at ændre #nav til følgende:
#nav {
position: relative;
top:0px;
height:25px;
margin: 0 auto;
padding:0;
}

(Jeg har fjernet width og tilføjet "auto" i margin)

loke
Joomla! Apprentice
Joomla! Apprentice
Posts: 40
Joined: Mon Jul 09, 2007 7:20 am
Location: Thisted

Re: centreret menu med css

Post by loke » Wed Jun 04, 2008 3:46 pm

Hej

Og tak for indsatsen.

Jeg prøvede at sætte din css kode ind i stedet for som du foreslog, men lige lidt hjalp det, menuen bliver stadig vist i venstre side. Jeg kiggede lignende css filer igennem og fandt en løsning hvor jeg kan få menuen længere ud på menu linjen ved at indsætte
padding-left:350px;
i stedet for
padding:0;
menuen bliver stadig vist fra venstre mod højre på denne måde bare længere ude på menu linjen, og derfor er løsningen ikke optimal, jeg er nødsaget til at skulle rette "padding-left:350px;" i px. hver gang jeg skal indsætte en ny menu knap på siden, dette vil jeg selv kunne leve med, men da siden ikke er min egen, men en af mine venners vil hun nok ikke selv være i stand til at lave denne rettelse hver gang hun tilføjer en ny knap.

Ny rettelse! i css filen der bare skyder menuen længere ud på menu linjen.

#horizmenu{
width:980px;
padding-left:350px;
height:25px;
margin:0px auto ;

}
Last edited by loke on Wed Jun 04, 2008 3:49 pm, edited 1 time in total.

User avatar
tresan
Joomla! Ace
Joomla! Ace
Posts: 1010
Joined: Thu Feb 09, 2006 3:00 pm
Location: Odense - DK
Contact:

Re: centreret menu med css

Post by tresan » Wed Jun 04, 2008 3:47 pm

Har du et link til siden? Det gør det noget nemmere.
Ronni K. G. Christiansen (@redwebdk)
http://www.redcomponent.com/ - One big family of Joomla extentions & templates
http://redweb.dk - Joomla Webdesign & Development
redHOST.dk - 100% Joomla Webhotel - Dansk support med Joomla viden!

Gadensgaard
Joomla! Champion
Joomla! Champion
Posts: 6139
Joined: Sat Nov 18, 2006 12:29 pm

Re: centreret menu med css

Post by Gadensgaard » Wed Jun 04, 2008 6:21 pm

Prøv at fjerne bredden på #horizmenu også


Locked

Return to “Template, CSS og Design”