Ergebnis 1 bis 3 von 3

Thema: Fragen zu div class id :hover :focus

  1. #1
    zaunbauer
    Gast

    Standard Fragen zu div class id :hover :focus

    Hallo,
    ich habe ein Problem mit meiner Navigationsleiste. Sie soll, von Hintergrundfarbe und Rahmen abgesehen, folgendermaßen aussehen:

    rechtsbündig ausgerichtet, beim Drüberfahren oder Anklicken soll sich der Link bzw. die Linkbeschreibung um vier Pixel anheben.

    Das Ergebnis sieht aber so aus:
    1. Ich habe über und unter meiner Navileiste innerhalb des Rahmens je eine Leerzeile(? ich denke es ist eine).
    2. Wenn ich den Fokus auf einem Link habe, kann ich an dem Rechteck erkennen, dass die padding-Angaben zwar wirken, jedoch nur auf das Fokus-Rechteck und nicht auf die Schrift.
    3. Das Fokus-Rechteck zeigt mir zwar an, dass sich bei :hover etwas tut, ich würde es jedoch später, zumindest in der Navigation, gern loswerden. Geht das eigentlich ?

    Ich habe jetzt schon vieles über class id und Vererbung gelesen (und bestimmt einiges verstanden), komme aber nicht weiter.

    css:

    body {
    margin:0;
    width:1024px;
    background-color:#0050A0;
    }

    #navigation {
    width:100%;
    background-color:#001060;

    border-top-color:#DFDFDF;
    border-top-style:solid;
    border-top-width:thin;
    border-bottom-color:#DFDFDF;
    border-bottom-style:solid;
    border-bottom-width:thin;

    font-family:Arial;
    font-size:16px;
    font-weight:normal;
    }

    #navigation ul {
    text-align:right;
    }

    #navigation li {
    display:inline;
    }

    #navigation li a {
    color:#FFFFFF;
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:4px;
    text-decoration:none;
    }

    #navigation li a:hover {
    color:#00C0FF;
    padding-top:4px;
    padding-bottom:8px;

    }


    html:

    <div id="navigation">
    <ul>
    <li><a href="index.php">Start</a></li>
    <li><a href="aboutme.php">Über&nbsp;mich</a></li>
    <li><a href="contact.php">Kontakt</a></li>
    </ul>
    </div>


    Weiß jemand Rat ?

    Zusätzliche Frage: Habe mich hier für id statt class entschieden, da die Navigationsleiste nur einmal vorkommen soll. Gedankengang richtig ?

    Gruß
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Fragen zu div class id :hover :focus

    Hab jetzt leider keine Zeit. Hilfr dir vielleicht das weiter (Variante 2)?
    http://www.ohne-css.gehts-gar.net/0024.php

  3. #3
    zaunbauer
    Gast

    Standard AW: Fragen zu div class id :hover :focus

    Oh ja, sehr schick!
    Ich werde mir mal den Code genauer anschauen und versuchen, das Ganze zu verstehen, wobei dort Dinge stehen, die ich (noch) nicht kenne.

    Meine Navi ist sehr viel einfacher gehalten und ich möchte sie von Anfang bis Ende selbst codieren, weil ich denke, dass ich es so am besten lernen kann.

    Zunächst würde ich gern wissen, wo die Leerzeilen herkommen. Liegt das am <div> ?

    @sejuma: Wäre klasse, wenn Du vielleicht noch Zeit findest. Eilt nicht!

    @alle anderen: Bin für jeden Hinweis dankbar!

    Gruß

Ähnliche Themen

  1. focus
    Von Dicker1 im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 22.12.2008, 18:38
  2. Bei class="active" kein Hover-Effekt: wie?
    Von Mütze im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 26.08.2008, 09:37
  3. 2 Fragen: Focus & positionierung
    Von Valker im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 20.08.2008, 15:38
  4. Focus ans PopUp
    Von simcon94 im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 12.08.2004, 11:33
  5. "css" Verschiedene :hover über das class="&am
    Von vandyce im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 18.04.2004, 15:57

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •