** Close ** [CSS/HTML] Naviations Problem

[Leon]

*schääm...*

Hallo zusammen,

Ich komme immer wieder zu diesem Problem, etwas mache ich falsch und mir ist es ein Rätsel was es sein könnte...

Ich wollte "als Übung" mal eine Navigation machen. Nunja, der grösste Teil hab ich geschaft, die Navigation ist fast fertig, es fehlt nur noch der Innere-Abstand. Ich möchte das mein "Link1" ein abstand von 13px von links hat... obwohl ich dann "padding..." verwende klappt das nicht, es verschiebt das ganze auch um 13px nach rechts, also hab ich auf der Rechter seite noch 13px mehr, was ja nicht sein sollte... ich glaube ihr kennt das Problem und ich hoffe mir kann einer helfen, weil dieses Problem micht immer und immer wieder verfolgt

Code

<div id="tobel" >
    <ul class="sidemenu">
     <li><a href="index.html">Home</a></li>
     <li><a href="index.html">Home</a></li>
     <li><a href="index.html">Home</a></li>
     <li><a href="index.html">Home</a></li>
    </ul>
</div>

CSS

#tobel {
 float: left;
 width: 144px;
 margin: 0 0 0 0; padding: 0;
 background-color: #fff;
}
 
#tobel ul.sidemenu {
 list-style: none;
 text-align: left;
 text-decoration: none;
 margin:0px;
}
 
#tobel ul.sidemenu li {
 display: inline;
}
 
#tobel ul.sidemenu a {
 display:block;
 background: url(link.gif);
 padding-left: 13px;
 width: 144px;
 height: 21px;
 margin: 1px;
}

Problem



Rechter Teil ist der Fehler...


Ich danke euch schon mal voraus

 

[joschilein]

Ich sehe in deinem CSS Ausschnitt nichts mit 13px und der Ansatz mit padding-left: 10px; ist doch schon genau der Ansatz, wenn du nur eine Seite ansprechen willst.. Das Problem erkenne ich also nicht wirklich

Dazu aber wieder mein alter Tipp: Möchte man wissen welche Box zu groß / verschoben etc ist, dann einfach mal unterschiedlich einfärben und schon sieht man an welcher Stelle noch gedreht werden muss.

 

[Leon]

Ich sehe in deinem CSS Ausschnitt nichts mit 13px und der Ansatz mit padding-left: 10px; ist doch schon genau der Ansatz, wenn du nur eine Seite ansprechen willst.. Das Problem erkenne ich also nicht wirklich

Dazu aber wieder mein alter Tipp: Möchte man wissen welche Box zu groß / verschoben etc ist, dann einfach mal unterschiedlich einfärben und schon sieht man an welcher Stelle noch gedreht werden muss.

#tobel ul.sidemenu a

Hatte das falsche gepostet, war vorhin 10px, habs jetzt geändert. Und das mit dem einfärben.. hab schon einiges versucht, an andere stellen und es will einfach nicht gehen...

Sobald man padding-left: 13px; weg nimmt, gibt es keine verschiebung mehr. Dann ist der Text einfach ganz nach links, was ich ja nicht möchte.

 

[joschilein]

Ich sehe aber auch auf den Screenshot keinen Fehler. Wie soll es denn aussehen? Oder meinst du den ganz leichten Strich auf der rechten Seite? Liegt das nicht eher am Hintergrundbild?

Stell mal ne Version online, da kann man das noch viel eher begutachten. Spontan fällt mir nichts auf, denn padding-left sollte eigentlich auch nur die linke Seite betreffen, anderes würde ich nicht mal den IE zutrauen

 

[Leon]

Hi leute,

habs hinbekommen... arg... ich hab was übersehen... hatte was mit dem Hintergrund zu tun.

Hab noch ein no-repat hinzugefügt... jetzt funktioniert es

Danke an alle mithelfer

 

[joschilein]

*umguck* "alle Helfer" *hust*

Das war eigentlich so klar, dass ich mir überhaupt nicht sicher war, ob das der gemeinte Fehler sein konnte.

Ich frage mich nur gerade, was padding im selben Element für einen Einfluss auf das Hintergrundbild haben kann.. Das Hintergrundbild füllt die ganze Fläche der Box und padding bestimmt dann wie der Text drüber gelegt wird.