Geld für Ihre Startseite!

MinkyMausy · 28.11.2011, 21:13:00

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:


1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
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!

theHacker · 28.11.2011, 21:15:27

Da steht nix von "30px vom rand weg"

margin, padding

MinkyMausy · 28.11.2011, 21:17:12

wie meinst? hab schon überall wo öglich wäre 30px mal eingetragen..macht nix

apolle · 29.11.2011, 02:30:00

Das Zauberwort ist "margin" in mehreren Varianten (margin-bottom, margin-left, marginwidth, leftmargin, ...). Details und Beispiele dazu gibts in der HTML-Bibel.

http://de.selfhtml.org/html/dateiwei...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>

Graccem · 29.11.2011, 08:05:47

Sinnlos margin und paddings eintragen bringt nicht viel

Das muss schon mit anderen Dingen einhergehen.

Code:


1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
	
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

MinkyMausy · 29.11.2011, 16:44:59

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...

Darklord · 29.11.2011, 17:05:14

Die Eigenschaften "top", "left" etc. verhalten sich abhänig von der gewählten Postitionierungsart des Elements.

http://www.css4you.de/position.html

28.11.2011, 21:15:27	#2 (permalink)
theHacker bekämpft die Mächte des Bösen ID: 69505 Lose-Remote Reg: 20.04.2006 Beiträge: 20.469	Da steht nix von "30px vom rand weg" margin, padding -> www.theHacker.ws v3 <- \| Lose-Gutscheine.de Werbung: Premium-Lose.de - Hier legt man Lose an!

Themen-Optionen
Druckbare Version zeigen Diese Seite per E-Mail verschicken
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[HTML/CSS] Textausrichtung von <li>-Element bei eigener Bullet-Grafik (erledigt!)	Duderich	Programmierung	12	15.02.2010 14:19:11
[HTML/CSS] Textausrichtung	BloodyMary1980	Programmierung	5	19.12.2007 12:13:03
[CSS] Textausrichtung	KeinKommentar	Programmierung	4	31.07.2006 07:51:07

28.11.2011, 21:17:12	#3 (permalink)
MinkyMausy IT-Systemkauffrau ID: 66092 Lose-Remote Reg: 01.05.2006 Beiträge: 345	wie meinst? hab schon überall wo öglich wäre 30px mal eingetragen..macht nix

29.11.2011, 02:30:00	#4 (permalink)
apolle Benutzer Reg: 25.09.2007 Beiträge: 34	Das Zauberwort ist "margin" in mehreren Varianten (margin-bottom, margin-left, marginwidth, leftmargin, ...). Details und Beispiele dazu gibts in der HTML-Bibel. http://de.selfhtml.org/html/dateiwei...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>

29.11.2011, 16:44:59	#6 (permalink)
MinkyMausy IT-Systemkauffrau ID: 66092 Lose-Remote Reg: 01.05.2006 Beiträge: 345	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...

29.11.2011, 17:05:14	#7 (permalink)
Darklord XHTML\|PHP\|SQL\|C ID: 227795 Lose-Remote Reg: 19.09.2006 Beiträge: 842	Die Eigenschaften "top", "left" etc. verhalten sich abhänig von der gewählten Postitionierungsart des Elements. http://www.css4you.de/position.html

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)