CSS - Position relative?

Dieses Thema im Forum "Webmaster Hilfe / Programmierer Forum" wurde erstellt von Lotus, 14.03.2010.

  1. Lotus

    Lotus Erfahrener Benutzer

    Dabei seit:
    17.02.2007
    Beiträge:
    2.428
    Zustimmungen:
    0
    Hi, ich hab erneut eine Frage:

    [​IMG]

    Die ersten beiden Navigationselemente passen sich optimal zusammen an, aber zwischen dem 3.ten und 2.ten ist immer wieder ca 2-3px Platz und ich weiß nicht wie ich das wegbekomme...

    In der HTML steht folgendes:
    Code:
    <img src="Bilder/navi_anfang.jpg" id="img_navi" /><br />
    <img src="Bilder/navi_b.jpg" id="img_navi_a" /><br />
    <img src="Bilder/navi_b.jpg" id="img_navi_a" />
    und in der CSS
    Code:
            #img_navi {
            border:0;
            margin-left:10px;
            position:absolute;
            }
            
            #img_navi_a {
            border:0;
            width:204;
            height:22;
            margin-left:10px;
            position:relative;         
            }
    
    Wisst ihr was ich falsch mache?
     
  2. AdMan

    schau mal hier: Windows-Wartungs-Tool. Viele Probleme lassen sich damit einfach beheben. Oftmals ist der PC dann auch schneller!
    Registrieren bzw. einloggen, um diese und auch andere Anzeigen zu deaktivieren.
  3. #2 Blaxxun, 14.03.2010
    Blaxxun

    Blaxxun aka Noisy

    Dabei seit:
    06.11.2005
    Beiträge:
    6.171
    Zustimmungen:
    0
    Auch wenn es sich dumm anhört. Manche Browser machen Problem, wenn Tabs oder Zeilenumbrüche im Quelltext sind.

    Teste mal
    HTML:
    <img src="Bilder/navi_anfang.jpg" id="img_navi" /><br /><img src="Bilder/navi_b.jpg" id="img_navi_a" /><br /><img src="Bilder/navi_b.jpg" id="img_navi_a" />
    
    Mit Leerzeichen auch am Zeilenende besonders aufpassen.
     
  4. Lotus

    Lotus Erfahrener Benutzer

    Dabei seit:
    17.02.2007
    Beiträge:
    2.428
    Zustimmungen:
    0
    Danke für deine Hilfe, aber leider ist das Ergebnis gleich dem obigen.

    Ps.:
    Du hast recht, der IE zeigt das schon deutlich besser an als Firefox, aber selbst dort liegt noch 1 PX zu viel Abstand!
     
  5. #4 Blaxxun, 14.03.2010
    Blaxxun

    Blaxxun aka Noisy

    Dabei seit:
    06.11.2005
    Beiträge:
    6.171
    Zustimmungen:
    0
    Warum überhaupt ne relative Poistion vergeben? Fällt mir jetzt erst auf, vergib einfach mal ein display: block; dann werden die Elemente wie DIVs interpretiert. Die Bilder werden dann automatisch untereinander angezeigt.
    Am optimalsten und besten ist übrigens die Lösung über Unsortierte Listen.
     
  6. Lotus

    Lotus Erfahrener Benutzer

    Dabei seit:
    17.02.2007
    Beiträge:
    2.428
    Zustimmungen:
    0
    Jetzt wird es besser ausgerichtet, nur nun kommt das Problem hinzu, durch die block eigenschaft ist die gesamte Zeile als Link quasi anklickbar.. kann man das nicht noch irgendwie unterbinden, bzw angeben wie weit diese zeile sein soll? quasi die zeile mit width auf die größe des buttons begrenzen..(ist halt der nachteil bei fauxcolumns xD)

    Das mit den Listen probier ich nacher auch nochmal!
     
  7. #6 Blaxxun, 16.03.2010
    Blaxxun

    Blaxxun aka Noisy

    Dabei seit:
    06.11.2005
    Beiträge:
    6.171
    Zustimmungen:
    0
    Liste
    li -> Block | a in li -> Inline

    Versuchs mal mit Hintergrundbildern ;)
    Und natürlich kannst du Block Elementen eine width und height zuweisen, das bleibt nur bei inline Elementen wirkungslos.
     
  8. Lotus

    Lotus Erfahrener Benutzer

    Dabei seit:
    17.02.2007
    Beiträge:
    2.428
    Zustimmungen:
    0
    Hey erstmal vielen dank für deine Hilfe, klappt alles super :)

    Gibt es eventuell eine Möglichkeit ein Objekt relativ zu einem ganz bestimmten Objekt x zu positionieren?

    Also z.B. ich hab folgende Elemente
    Header-Bereich
    Navi-Bereich
    Main-Bereich
    Hier möchte ich ein Objekt positionieren, aber welches vom HEADER aus positioniert ist und nicht absolute oder relative von dem relativen Objekt davor!
    Footer-Bereich
     
  9. #8 Blaxxun, 16.03.2010
    Blaxxun

    Blaxxun aka Noisy

    Dabei seit:
    06.11.2005
    Beiträge:
    6.171
    Zustimmungen:
    0
    Soweit mir bekannt nicht ohne Umstände. Ein bisschen rumprobieren hilft. Ich würde das Element im Header platzieren und ein bisschen mit dem z-index und verschiedenen positions probieren, eventuell hilft auch ein negatives padding. Solltest du aber in allen wichtigen Browsern testen.
    Je nach deinen JS Kenntnissen ist das auch relativ leicht über Frameworks realisierbar, z.B. jQuery oder Prototype.
     
  10. AdMan

    Es ist generell erstmal empfehlenswert alle ggf. veralteten oder fehlerhaften Treiber zu scannen und auf neue zu aktualisieren. Hier kannst du einen Treiber-Scanner downloaden. Das erspart oftmals viel Ärger und hilft gegen diverse Probleme.
    Registrieren bzw. einloggen, um diese und auch andere Anzeigen zu deaktivieren.
  11. Lotus

    Lotus Erfahrener Benutzer

    Dabei seit:
    17.02.2007
    Beiträge:
    2.428
    Zustimmungen:
    0
    JS kenntnisse besitze ich eigentlich gar nicht, aber eventuell kann man sich diese ja noch aneignen ;)

    bisher ist das ganze echt umstaendlich mit den ganzen includes etc.. ich vermisse die gute alte zeit wo das ganze noch easy mit frames gestaltet wurde ;)
     
  12. #10 Blaxxun, 16.03.2010
    Blaxxun

    Blaxxun aka Noisy

    Dabei seit:
    06.11.2005
    Beiträge:
    6.171
    Zustimmungen:
    0
Thema: CSS - Position relative?
Besucher kamen mit folgenden Suchen
  1. css position relative problem

    ,
  2. bilder mit css positionieren relativ

    ,
  3. css positionierung relative problem

Die Seite wird geladen...

CSS - Position relative? - Ähnliche Themen

  1. Firefox: Scrollbalken Position wird nicht gemerkt

    Firefox: Scrollbalken Position wird nicht gemerkt: Ich glaube seit dem neuesten Update habe ich folgendes Problem. Wenn ich auf einer Seite (immer bei Ebay und Youtube) Suchergebnisse anklicke,...
  2. Relativ ungewöhnliche Frage-Befehle am PC mehrere Male in Folge durch führen

    Relativ ungewöhnliche Frage-Befehle am PC mehrere Male in Folge durch führen: Hallo, ich habe eine relativ ungewöhnliche, für mich aber wichtige Frage: Ist es möglich, dass Aktionen die im am PC mache, mehrere Male...
  3. CSS Auflösung inakzeptabel!

    CSS Auflösung inakzeptabel!: Hey liebe Community, ich habe vor kurzem mein BS neu aufgespielt, vorher war dort Win 8 Pro 64 Bit installiert, leider musste ich aber aufgrund...
  4. Spezielle Navigation (Html / Css)

    Spezielle Navigation (Html / Css): Wunderschönen Guten Abend. Ist es möglich das Menü von dieser Seite Musicbase.fm - Clubsection ohne JavaScript, also nur mit HTML & CSS, zu...
  5. CSS externe methode

    CSS externe methode: Hey leute ich lerne gerade CSS und bei der ecternen methode wird die style.css nicht ausgelesen was mach ich falsch? Code: <!DOCTYPE HTML PUBLIC...