CSS. Innenrand in Safari falsch dargestellt

Diskutiere mit über: CSS. Innenrand in Safari falsch dargestellt im Web Page Design Forum

  1. 19.september

    19.september Thread Starter Gast

    CSS. Innenabstand in Safari falsch dargestellt

    Hi ich hab ein Problem mit der korrekten Darstellung von meinem CSS in Safari. Folgendes:

    Ich hab einen ID-Stil für ein Element mit einem Innenabstand links von 5 Pixeln. Das Element hat eine Breite von 100 Pixeln. In Safari wird das Element auf der rechten Seite verlängert. Im Internet Explorer wird das Element korrekt dargestellt. Wie kann ich das beheben?

    Hier der Quelltext von dem ID-Stil welcher auf das Element angewendet wird:

    #menue { color: gray; font-size: 12px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight: bold; line-height: 130%; text-decoration: none; background-color: #ccf; visibility: visible; padding-top: 10px; padding-left: 5px; position: absolute; top: 111px; left: 10px; width: 100px; height: 100px; border: solid 1px white }

    Bin für jede Hilfe dankbar.

    Grüßle und schöne Ostern!

    Tom
     
    Zuletzt von einem Moderator bearbeitet: 26.03.2005
  2. 2nd

    2nd MacUser Mitglied

    Beiträge:
    8.902
    Zustimmungen:
    242
    Registriert seit:
    25.07.2004
    Hmm, also im Internet Explorer und Mozilla geht es unter Windows. Der Code sieht richtig aus und simple Breitenangabe sollte auch Safari beherrschen. Ich habe mal ein paar Zeilenumbrüche reingemacht:

    PHP:
    #menue { 
        
    colorgray
        
    font-size12px
        
    font-familyHelveticaGenevaArialSunSans-Regularsans-serif
        
    font-weightbold
        
    line-height130%; 
        
    text-decorationnone
        
    background-color#ccf; 
        
    visibilityvisible
        
    padding-top10px
        
    padding-left5px
        
    positionabsolute
        
    top111px
        
    left10px
        
    width100px
        
    height100px
        
    bordersolid 1px white;
    }
    Eigentlich sollte das fkt.. Safari habe ich im Moment nicht am Start, ich probier das morgen nochmal!

    Frank
     
  3. Hilarious

    Hilarious MacUser Mitglied

    Beiträge:
    2.195
    Zustimmungen:
    5
    Registriert seit:
    25.11.2004
    Hi Tom,

    kann es vielleicht an etwas anderem liegen?

    Ich habe mal interessehalber Deinen Stil in diesem HTML-Test angewandt:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    
    	<head>
    		<title>Unbenannte Seite</title>
    		<style type="text/css" media="screen"><!--
    		#menue { color: gray; font-size: 12px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight: bold; line-height: 130%; text-decoration: none; background-color: #ccf; visibility: visible; padding-top: 10px; padding-left: 5px; position: absolute; top: 111px; left: 10px; width: 100px; height: 100px; border: solid 1px white }
    
    --></style>
    	</head>
    
    	<body bgcolor="#ffffff">
    		<div id="menue">Element</div>
    	</body>
    
    </html>
    
    Das Ergebnis ist ziemlich kongruent (v.l. MSIE6XP2, Safari-1.24, Firefox-1.0.2):
    [​IMG]

    Ich hoffe, es hilft ;)
     
  4. 19.september

    19.september Thread Starter Gast

    Danke erstmal.

    ICh hab auch festgestellt, daß der IE unter WIN und MacOS die Seite richtig darstellt. Da bin ich echt am Ende mit meinem Latein…

    Hier der Link zu der Seite, damit ihr es in nautra seht. http://www.tomislavroemer.de/

    Wie gesagt, IE ok; Safari, Camino nok.

    Merci!
     
    Zuletzt von einem Moderator bearbeitet: 27.03.2005
  5. kelli

    kelli MacUser Mitglied

    Beiträge:
    301
    Zustimmungen:
    0
    Registriert seit:
    27.01.2004
  6. 19.september

    19.september Thread Starter Gast

    Ne, klappt noch immer nicht. Hab jetzt die Ränder und Abständer dazu addiert und auch versucht von der Summe abzuziehen. Im IE und Safari hab ich immer ein anderes Resultat. Wenn's im IE stimmt, stellt es Safari falsch dar und umgekehrt.. Hexenwerk!

    Oder hab ich da was falsch verstanden?!
     
  7. defect

    defect MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    Registriert seit:
    12.11.2004
    Hast Du vielleicht den IE 5(!) für Win?
    Der Internet Explorer 5 (Win) rechnet Abstände von der Box-Breite ab (Also zB. 400px Breite; 5 Padding: 400 Breite gesamt) Andere Browser (Auch der IE 6, den Hilarious in seinem Screenshot verwendet) rechnen die Abstände drauf (410px Gesamtbreite - 5 rechts, 5 links Padding drauf) - und das ist auch richtig so
    SelfHTML sagt dazu folgendes:

    Sollte das für das Problem verantwortlich sein, ist der IE das Problem, nicht Safari. Zum Umgehen gibt es einen sogenannten Box-Model-Hack, ein Link dazu ist ja hier schon gepostet.

    mit Gruß. godn

    EDIT: hier (klick) nochmal das Ganze sehr ausführlich ;)

    EDIT": *gröhl* Das Forum läuft noch nicht auf Sommerzeit, es ist schon 01.42 Uhr :D
     
    Zuletzt bearbeitet: 28.03.2005
  8. MUG Hannover

    MUG Hannover MacUser Mitglied

    Beiträge:
    33
    Zustimmungen:
    0
    Registriert seit:
    31.12.2003
    Oder ist schlichtweg der DOCTYPE nicht richtig gesetzt?
     
  9. defect

    defect MacUser Mitglied

    Beiträge:
    827
    Zustimmungen:
    7
    Registriert seit:
    12.11.2004
    Da hat MUG in der Tat sehr Recht, selbst wenn Du den IE 6 hast, kann der von mir beschrieben Fehler auftreten, nämlich bei DOCTYPE-Fehlern... Unbedingt mal auf korrekten DOCTYPE achten, und wenn der nicht korrekt ist und/oder wenn zB. der XML-Prolog drin ist: schmeiss den raus, das Ding löst Probleme aus und ist laut Spezifikationen auch nur optional!

    mit Gruß. godn
     
    Zuletzt bearbeitet: 28.03.2005
  10. 19.september

    19.september Thread Starter Gast

    DOCTYPE:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    liegt also nicht daran. ich hab jetzt auch mal den Hack ausprobiert, aber irgendwie klappt das auch nicht.

    Muß der Hack vor mein Eigentliches Element im Quelltext?
     
Die Seite wird geladen...
Ähnliche Themen - CSS Innenrand Safari Forum Datum
Safari bindet Google-Kalender nicht ein Web Page Design 05.10.2016
CSS Selektor - Leerzeichen Web Page Design 12.09.2015
lokale css-Anweisung für macuser.de? Web Page Design 21.07.2015
Auslagerung von Klassen in CSS-File Web Page Design 02.04.2015
Webseiten Editieren mit Safari Web Page Design 09.10.2014

Diese Seite empfehlen