• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Navigation - Abstände angleichen

  • Ersteller Ersteller manu_3390
  • Erstellt am Erstellt am
M

manu_3390

Guest
Hallo Leute,

ich habe ein Problem auf einer meiner Internetseiten. (Siehe www.vital-centrum-altdorf.de)

Die Abstände oben in der Navigation sind nicht gleich, zB. ist der Abstand zwischen "Home" und "Produkte" ander als der zwischen "Paddock Trails" und "Schulung/Aufklärung".

Wie bekomme ich die Abstände zwischen den einzelnen Feldern gleich?

Hier die CSS:

html, body {
margin: 0px auto;
padding:0px;
}
h2{ font: 18px, Arial, Helvetica, sans-serif;}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 18px;
font-variant: normal;
text-transform: none;
color: #929291;
text-decoration: none;
background:#FFF url(../images/bg.jpg) repeat-x top left;
}
a:hover{color:#000;}
a{color:#ffffff;}
.main
{
width:860px;
height:auto;
margin:0px auto;
padding:0px;
}
.header {
margin:0 auto;
padding:0px;
width:850px;
padding:7px 10px 0px 0px;

}
.header-top
{
width:850px;
height:25px;
padding-bottom:9px;
padding-top:20px;
text-align:left;
color:#ffffff;
text-decoration:none;
}
.header-top a{
color:#FFFFFF;
text-decoration:none;
}

.header-bottom
{
height:31px;
padding-left:166px;
text-align:left;
}
/* CSS Menu */
#navcontainer {
margin:0px;
padding: 0;
height: 31px;
}

#navcontainer ul {
border: 0;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li {
display: block;
float: right;
text-align: center;
padding: 0;
margin: 0;
height:25px;
}

#navcontainer ul li a {
width: 130px;
height: 25px;
padding: 0px;
margin: 0px;
color: #FFF;
text-decoration: none;
display: block;
text-align: center;
font: 14px/30px Arial, Helvetica, sans-serif;
}

#navcontainer ul li a:hover {
color: #bebfc4;
background:#7e0d9b;
height:25px;
}

#navcontainer li.active a {
color: #fff;
background:#7e0d9b;
height:25px;
}

.body-main
{
border-top:1px solid #FFFFFF;
width:860px;
height:auto;
margin:0px auto;
text-align:left;
padding-top:20px;
clear:both;
position: relative;
}
.body-top
{
padding-bottom:20px;
width:860px;
margin:0px auto;
height:350px;
}
.left-box
{
width:408px;
float:left;
text-align:left;
}
.body-right
{
width:440px;
height:auto;
float:right;
text-align:left;
}
.blank38
{
width:440px;
height:38px;
}
.welcome-inside
{
padding:6px;
text-align:left;
color: #FFFFFF;
}
.fav-project
{
}
.fav-text
{
height:93px;
text-align:left;
color: #ffffff;
}
.title-16 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 24px;
font-style: normal;
line-height: 28px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
padding-left:3px;
}
.title-14 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: 20px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
}
.body-bottom
{
padding-bottom:15px;
width:840px;
margin:0px auto;
padding-top:26px;
height:225px;
padding-left:15px;
}
.bottom-box1
{
width:205px;
text-align:left;
float:left;
}
.bottom-box1-inside
{
width:192px;
height:auto;
}
.bottom-box-th
{
background:url(../images/image-box-bg.gif) left top no-repeat;
padding-left:11px;
padding-top:12px;
padding-bottom:12px;
padding-right:13px;
}
.green-link-box
{
padding:10px 0px 10px 15px;
}
.read-more {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 16px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
}
._blank {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: 16px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
}
.read-more:hover
{
color:#bebfc4;
text-decoration:none;
}


#footer
{
margin:0 auto;
width:100%;
height:75px;
text-align:center;
color:#000000;
clear:both;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding-top:25px;
background-color: #efe2ec;
}
#footer a
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-style: normal;
line-height: 26px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
}
#footer a:hover
{
color:#000;
text-decoration:none;
}
.body-top a{color:#FFFFFF;}


Danke schonmal vorab!
 
Okay werde ich auf jedenfall noch tun, danke für die Info!
Ist es trotzdem möglich rauszufinden wo mein Fehler liegt dass die Abstände ungleich sind?
 
Wenn Du statt einer festen Breite bei #navcontainer ul li a ein padding links und rechts angibst, gleicht es sich besser aus.
 
Mhh verstehe ich jetzt nicht ganz, kannst du mir sagen wie ich dass dann an der Stelle in der CSS abändern müsste?

}

#navcontainer ul li a {
width: 130px;
height: 25px;
padding: 0px;
margin: 0px;
color: #FFF;
text-decoration: none;
display: block;
text-align: center;
font: 14px/30px Arial, Helvetica, sans-serif;
}
 
Hast du den Code selber geschrieben?

Die Abstände können nicht ungleich sein, weil es keine gibt. Sondern nur Anker mit fixer width und text-align:center.
 
Zurück
Oben