zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Horizontale Liste - IE, Firefox, Opera -> Padding nach Lust und Laune

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 22.01.2007, 21:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard Horizontale Liste - IE, Firefox, Opera -> Padding nach Lust und Laune

Hi,

ich hab grad mal wieder ein Problem mit dem ich jetzt schon wieder ewig dasitze, wo es sich doch mal gerade um 1px abstand hin oder her handelt.

Also, moi hat folgendes simples XHTML:

Code:
                    <div id="globalnav">
                        <ul>
                            <li><a href="Default.aspx" class="selected">home</a></li>
                            <li><a href="Solutions.aspx">solutions</a></li>
                            <li><a href="Company.aspx">company</a></li>
                            <li><a href="work.aspx">our work</a></li>
                            <li class="last"><a href="Contact.aspx">contact</a></li>
                        </ul>
                    </div>
mit folgendem CSS:

Code:
#globalnav
{
	margin-top:10px;
	height:30px;
	float: right;
	border:1px solid white;
}

#globalnav ul li
{
	padding-top:10px;
	margin-left: 0;
	padding-right: 23px;
	display: inline;
	list-style: none;
}

#globalnav ul
{
	border:1px solid red;
}

#globalnav li.last
{
	padding: 0;
}

#globalnav ul li a
{
	color: #FFF;
	text-decoration: none;
	font-size: .65em;
	letter-spacing: 1px;
}

#globalnav ul li a:hover
{
	color: #d43b3b;
}

#globalnav ul li a.selected
{
	color: #FFF;
	padding-bottom:10px;
	border-bottom: 1px solid #d43b3b;
}
Das Problem hier ist jetzt, dass bei jedem Browser das vertical alignment des textes einer inline gestellten list unterschiedlich ist (habs im Bild markiert was ich meine). Hat irgendwer eine Ahnung was ich tun kann, damit ich den Text überall auf die gleiche Höhe bringe?

Danke,

Daikoku
Angehängte Grafiken
Dateityp: jpg cssproblem.jpg (44,0 KB, 17x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 22.01.2007, 21:50
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 21.01.2007
Beiträge: 106
Artemis befindet sich auf einem aufstrebenden Ast
Standard

Setz mal line-height auf z.B. 1.5em.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 22.01.2007, 21:53
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard

Hatte schon probiert mit line-height rumzuspielen, aber ich bekomme den text trotzdem nicht überall auf die gleiche Höhe. Es ist immer um 1-2px falsch
Mit Zitat antworten
  #4 (permalink)  
Alt 23.01.2007, 10:56
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.925
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

1. Setz die Abstände global auf 0, da alle Browser verschiedene Standardabstände nutzen

* { padding: 0; margin: 0; }

2. Ist z.B. ein padding-top oder padding-bottom unzulässig für ein Inlineelement.

3. Setz für das A deine gewünschte Höhe mit line-height
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #5 (permalink)  
Alt 23.01.2007, 14:20
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Boris Beitrag anzeigen
1. Setz die Abstände global auf 0, da alle Browser verschiedene Standardabstände nutzen

* { padding: 0; margin: 0; }
Hab ich, hatte nur nicht die komplette CSS gepostet, sorry
Zitat:
Zitat von Boris Beitrag anzeigen
3. Setz für das A deine gewünschte Höhe mit line-height
Hatte ich wie in meinem letzten Post angesprochen auch schon probiert, allerdings bleibt immer ein 1-2px Unterschied
Mit Zitat antworten
  #6 (permalink)  
Alt 23.01.2007, 14:36
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard

So ich hab jetzt mal ne Testseite gemacht und hochgeladen: Testseite
Mit Zitat antworten
  #7 (permalink)  
Alt 23.01.2007, 16:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.03.2004
Beiträge: 1.838
RoToRa wird schon bald berühmt werden
Standard

Warum diesen pixelgenauen Zwang? Man kann die Schriftgröße eh nicht endgültig vorgeben.

Oder glaubst du die Anwender werden schreiend davon rennen, wenn sie ausversehen die Site in zwei verschiedenen Browsern mit einer Lupe ansehen und die paar Pixel Unterschied feststellen?

Wann lernen die selbsternannten Webdesigner, dass Webdeisgn kein Druckdesign ist, das Unterschiede von Browser zu Browser unvermeidlich, normal und gar gewollt sind, und ausser ihnen sich kein Arsch dafür interessiert?

Robin
Mit Zitat antworten
  #8 (permalink)  
Alt 23.01.2007, 17:04
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard

Weil der aktive Link rot unterstrichen sein soll. Dieser Strich soll wiederum auf einer Linie aufsetzen. 1px Unterschied fällt dort sehr wohl auf
Mit Zitat antworten
  #9 (permalink)  
Alt 24.01.2007, 09:33
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

Zitat:
Zitat von RoToRa Beitrag anzeigen
Wann lernen die selbsternannten Webdesigner, dass Webdeisgn kein Druckdesign ist, das Unterschiede von Browser zu Browser unvermeidlich, normal und gar gewollt sind, und ausser ihnen sich kein Arsch dafür interessiert?
vielleicht kapieren sie es ja eines Tages, wenn man sich usurpatorisch in Printtechniken einmischt und dauernd relative Maßangaben für genormte Druckprodukte erstellt...

zum Thema: Warum ist eine Pixelbreite vorgegeben, wenn nur der Linktext ein underline oder border-bottom erhalten soll?
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 24.01.2007, 10:13
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.11.2006
Beiträge: 17
Daikoku befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von mazzo Beitrag anzeigen
zum Thema: Warum ist eine Pixelbreite vorgegeben, wenn nur der Linktext ein underline oder border-bottom erhalten soll?
Sorry, ich versteh nicht genau was für eine Pixelbreite du meinst?
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Ungewöhnlicher abstand beim clearen von floats adrianno CSS 14 16.09.2009 14:20
Float-Reihenfolge? wolf1985 CSS 0 21.08.2008 01:35
Opera verschiebt die Liste und Firefox macht abständer :( ThorstenSt CSS 13 15.08.2005 13:05
div -> Border -->> Wirkung opera firefox Holger (HMR) CSS 1 01.04.2005 17:44
horizontale Liste mit Links - Problem mit Opera mikey CSS 0 05.01.2005 12:19


Alle Zeitangaben in WEZ +2. Es ist jetzt 06:30 Uhr.