HTML/CSS Textausrichtung

M

MinkyMausy

IT-Systemkauffrau
1 Mai 2006
311
12
Hallo Zusammen,

ich verzweifel an der Textausrichtung im Menü, kann ich das irgendwie Pixelgenau machen?
Mit text-align: center; richtet er mir es mittig aus, ich will es aber nicht 100% mittig sondern etwa 30px vom rand weg da zwischen Rand und Text noch ne kleine Grafik ist und ich will das es direkt an der Grafik anschließt.
Tante Google hilft mir leider nicht weiter.

Ach ja und es klebt auch oben am Rand... soll au mittig ausgerichtet sein....
Hier der Code:
Code: 
a {
      display:  inline-block;
      color:#ffffff;
      background-color:#fff;
      width:200px;
      height: 43px;
      font-size:15px;
      font-family:Verdana, Arial, sans-serif;
      font-weight:bold;
      text-decoration:none;
      text-align:  center;

      vertical-align: middle;
      background-image:url(Grafik/button1.gif);
      }
   a:hover {
      display: inline-block;
      color:#000000;
      background-color:#000;
      background-image:url(Grafik/button2.gif);
      }
Danke für eure Hilfe!
 
Zuletzt bearbeitet von einem Moderator:
Das Zauberwort ist "margin" in mehreren Varianten (margin-bottom, margin-left, marginwidth, leftmargin, ...). Details und Beispiele dazu gibts in der HTML-Bibel.

https://de.selfhtml.org/html/dateiweit/seitenraender.htm#definieren

HTML-Code
<body marginwidth="50" marginheight="100" topmargin="100" leftmargin="50">

CSS-Code
<style type="text/css">
body { margin-left:50px; margin-right:50px; margin-top:100px; margin-bottom:100px }
</style>
 
Sinnlos margin und paddings eintragen bringt nicht viel ;) Das muss schon mit anderen Dingen einhergehen.


Code: 
a { 
  display: inline-block; 
  color:#fff; 
  background-color:#fff;
  width:170px; /* Breite reduzieren, da padding hinzukommt */
  height: 43px; 
  line-height: 43px; /* vertikale Ausrichtung erzeugen */
  font-size:15px; 
  font-family:Verdana, Arial, sans-serif; 
  font-weight:bold; 
  text-decoration:none; 
  padding-left:30px; /* Links ausrichten, mit einem Abstand von 30px */
  background-image:url(Grafik/button1.gif);
}

HTH
 
Wunderbar, das hat geklappt. Danke!

Jetzt muss sich das ganze noch nach unten und nach links verschieben lassen, mit "top" und "left" klappt es nich...
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben