tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
3
ZUGRIFFE
461
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Premker Premker ist offline Grünschnabel
    Registriert seit
    Jul 2011
    Beiträge
    4
    Hallo CSS-Weise hier im Forum,

    ich habe hier eine Navi und ich will die Links genau über den Bildern ausrichten.
    Hat jemand einen Tipp, wie ich das hinbekomme?
    Die Links sind ul, stehen in einem eigenen Div.
    Meine Idee war in etwa, das man das mit einem span-Tag hinkriegt. Aber ich check nicht, wo und wie ich das einsetzen muss.

    Ich bitte demütigst um einen Tipp und freue mich auf ein Feedback ...

    Premker

    HTML-Code:
    <div id="wrapper">
    	<div id="header">
    		<div id="navi">
    			<ul>
    				<li><a href="index.html">Willkommen</a></li>
    				<li><a href="hotel.html">Hotel</a></li>
    				<li><a href="zimmer.html">Zimmer</a></li>
    				<li><a href="urlaub.html">Urlaub</a></li>
    				<li><a href="anfahrt.html">Anfahrt</a></li>
    				<li><a href="buchen.html">Buchen</a></li>
    			</ul>
    			</div><!-- Ende Navi -->
    	</div><!-- Ende Header -->
    Code css:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    
    #wrapper {
        width: 999px;
        position: relative;
        margin-right: auto;
        margin-left: auto;
        top: 12px;
        border: 1px solid #666;
    }
     
    #header {
        background-image: url(images/header.jpg);
        height: 239px;
        width: 999px;
        background-repeat: no-repeat;
    }
     
    #navi {
        font-family: Verdana, Geneva, sans-serif;
        margin-left: 86px;
        width: 800px;
        margin-top: 125px;
        position: absolute;
        color: #FFF;
    }
     
    #navi ul li a {
        font-size: 0.8em;
        list-style-type: none;
        font-weight: bolder;
        padding-left: 5px;
        margin-right: 26px;
        margin-left: 26px;
        padding-right: 5px;
        color: #FFF;
        text-decoration: none;
        }
     
    li {
        display: inline;
    }
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken Navi exakt über Bildern ausrichten-header-hotel.jpg  
    Geändert von sheel (08.12.11 um 00:46 Uhr) Grund: Codetags
     

  2. #2
    djheke djheke ist offline Mitglied Silber
    Registriert seit
    Sep 2011
    Beiträge
    96
    Hallo,

    na du könntest ja deine bereits hier gezeigte Grafik nutzen und mit der Gilder/Levin-Methode diene Linktexte
    hinter deiner Grafik verstecken.

    Gilder/Levin Replacement-Methode
     

  3. #3
    Premker Premker ist offline Grünschnabel
    Registriert seit
    Jul 2011
    Beiträge
    4
    Danke für den Link djheke,
    geniale Seite, gut erklärt und auch noch auf deutsch. Im Moment habe ich das Problem mit Tipps aus anderen Foren geklärt, weil hier keine Antworten bisher kamen. Mit der Gilder/Levin Methode kann ich auf meiner Site aber auch noch arbeiten.

    Gruß Premker
     

  4. #4
    djheke djheke ist offline Mitglied Silber
    Registriert seit
    Sep 2011
    Beiträge
    96
    Na dann viel Erfolg und Danke für dein Feedback. Freud mich.
     

Ähnliche Themen

  1. sweep nurbs exakt an spline ausrichten
    Von d4wn im Forum Cinema 4D
    Antworten: 9
    Letzter Beitrag: 24.05.10, 17:56
  2. Listen-Navi rechts ausrichten
    Von Grille im Forum CSS
    Antworten: 2
    Letzter Beitrag: 28.10.09, 14:38
  3. Brauche Hilfe beim ausrichten von Bildern
    Von Captain Subtext im Forum Cinema 4D
    Antworten: 1
    Letzter Beitrag: 20.03.08, 17:54
  4. Objekte zueinander exakt ausrichten
    Von tomengel im Forum Cinema 4D
    Antworten: 3
    Letzter Beitrag: 11.10.07, 21:22
  5. Untermenü einer Navi ausrichten
    Von Da_Sven im Forum Javascript & Ajax
    Antworten: 3
    Letzter Beitrag: 23.07.05, 00:51