kostenloser Webspace werbefrei: lima-city


CSS: vertical-align funktioniert nicht !! ??

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    t*********************n

    Also Leute da bin ich wieder,

    ich habe ein weiter Problem und zwar das bei meinem Links der Text nicht vertikal in der Mitte positioniert wird !!
    Ich weiß nicht warum und weiß nicht mehr weiter. Ich werde noch irre !!

    Hier der betroffene Teil des CSS Codes:
    #menu td {
      	width: 160px;
      	height: 30px;
      	text-align: center;
    }
    
    #menu a {
      	display: block;
      	width: 150px;
      	height: 28px;
      	margin-left: 12px;
      	color: #FFFFFF;
      	text-decoration: none;
      	background-image: url(../grafik/link/link1.png);
    }
    
    #menu a:link {
      	color: #FFFFFF;
      	vertical-align: bottom;
    }
    
    #menu a:visited {
      	color: #FFFFFF;
    }
    
    #menu a:hover {
     	color: #FFFFFF;
      	border: 0;
      	background-image: url(../grafik/link/hover1.png);
    }
    
    #menu a:active {
      	color: #FFFFFF;
      	background-image: url(../grafik/link/active1.png);
    }


    Bin jeder Hilfe dankbar
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Tja, das mit dem vertical-align ist so eine Sachen. Da musst du dich mit Notlösungen zurechtfinden, da das nicht mit allen Elementen funktioniert:

    Man kann damit also kleineren Text an größerem Text oder auch an Grafiken ausrichten - nicht aber die vertikale Positionierung in einem Blockelement (z.B. div-Element) direkt bestimmen. Außerdem kann Text damit vertikal in Tabellenzellen positioniert werden. Der Normalwert ist dabei »baseline« - die Grundlinie.

    Quelle: http://www.css4you.de/Texteigenschaften/vertical-align.html

    Notfalls kannst du die line-height auf 250% o.Ä. setzten. Das geht jedoch wiederum nur mit einzeiligen Texten, oder ein Tabellfeld nehmen. Da landet der Text automatisch in der Mitte.

    Gruß, Prog
  4. Das mit dem Zentrieren ist immer so eine Sache für sich! ;S

    Kannst du zusätzlich noch den HTML-Teil posten und sagen, in welchem Broswer du das Problem hast?

    P.s.: Versuche vorerst vielleicht schonmal ein "text-align:center" bei "#menu a" hinzuzufügen, vielleicht reicht das schon. Ansonsten sind "margin:auto" oder "body,html{padding:0px;height:100%;width:100%}" gewisse Wunderwaffen, was das Zentrieren betrifft. ;) Aber wie bereits gesagt, ließe es sich mit mehr Informationen besser helfen.
  5. Autor dieses Themas

    t*********************n

    Es soll au keinen Fall keine Browserspezifische Seite werden.

    Ich habe jetzt schon etliche sachen probiert.

    @prog:
    das problem ist ich kann ja nicht einfach ein td hineinsetzen.

    @i-spacke:
    ich hab es der definition des a-Tags hinzugefügt, aber das hat auch nichts geändert.

    Danke trotzdem für die Bemühung.

    Beitrag geändert: 23.12.2008 21:40:23 von tactical-airsoft-berlin
  6. Dann wäre es echt toll, wenn du uns auch noch den HTML-Code liefern könntest. Per Spekulation lässt es sich einem immer nur sehr mühseelig und langwierig helfen...

    Edit: Rechtschrieb ;)^^

    Beitrag geändert: 23.12.2008 23:00:29 von i-spacke
  7. Autor dieses Themas

    t*********************n

    Naja der Code ist ja kein Besonderer:

    <table>
    <tr>
    <td>
    <a href="../">Startseite</a>
    </td>
    </tr>
    <tr>
    <td>
    <a href=".">News</a>
    </td>
    </tr>
    <tr>
    <td>
    <a href="../team/">Team</a>
    </td>
    </tr>
    <tr>
    <td>
    <a href="../rules/">Regeln</a>
    </td>
    </tr>
    <tr>
    <td>
    <a href="../gally/">Gallerie</a>
    </td>
    </tr>
    <tr>
    <td>
    <a href="../sponsor/">Sponsoren</a>
    </td>
    </tr>
    </table>

  8. http://www.css4you.de/Texteigenschaften/line-height.html
    Einfach bei "#menu a" ein "line-height:28px" oder wie halt die Höhe sein soll einfügen und dein Problem sollte gelöst sein.

    Edit: @tct Richtig, aber mit barrierefreiem Design haben es selbst viele, die es versuchen nicht so wirklich am Hut...

    Beitrag geändert: 23.12.2008 23:04:30 von i-spacke

  9. http://www.css4you.de/Texteigenschaften/line-height.html
    Einfach bei "#menu a" ein "line-height:28px" oder wie halt die Höhe sein soll einfügen und dein Problem sollte gelöst sein.

    Richtig, wobei ich das ganze eher in eine Liste packen würde. Das ist nicht nur übersichtlicher, sondern auch "richtiger", da Tabellen nicht zum designen der Seite verwendet werden sollten.
  10. Autor dieses Themas

    t*********************n

    Danke !! Danke Leute !! ,, so funktioniert es. . nochmals vielen dank !! :king:

    :thumb:
  11. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!