Safari ignoriert CSS

  1. SilentBob

    SilentBob Thread Starter MacUser Mitglied

    Mitglied seit:
    01.02.2005
    Beiträge:
    360
    Zustimmungen:
    0
    So, das Design ist soweit fertig. Ich entwickle immer im Firefox. Wenn ich damit fertig bin, schaue ich mir die Seite im IE (6, 5.5 und 5.01) auf der Dose an und notiere mir, was der mal wieder nicht kann. *seufz* Gestern dachte ich dann, schaue es Dir noch einmal in Opera an (Win und Mac). Kein Problem. Lalala trällerte ich vor mir her und schaute mir die Seite in Safari an. :eek: :eek: Was macht der denn???? Ignoriert einfach meine CSS-Anweisungen (teilweise)! Und dabei ist weder die Seite noch die CSS exotisch oder kompliziert! Jemand eine Idee, woran das liegen könnte? Ist mir das erste Mal passiert...

    Code-Snippet der HTML:
    HTML:
    <div id="content">
     <p class="hallo">Langer Begrüßungstext. Blabla. Und das typische Lorem ipsum...</p>	
     <div id="starttermine">
      <h2>Termine</h2>
      <p>
      <strong>01.01.06</strong><br />
      Termine kommen hier rein. Dies ist der erste Termin.<br /><a href="/termine/index.php#ter1">Link zum Termin	</a>
      </p>
      <p>
      <strong>03.02.06</strong><br />
      Zweiter Dummy-Termin. Auch hier fiel Blabla.<br /><a href="/termine/index.php#ter2">Link zum Termin</a>
      </p>
     </div>
    
     <div id="startnews">
      <h2>Neues</h2>
      <p>
      <strong>12.12.05</strong><br />
      Wer hätte es gedacht? Hier kommen die Neuigkeiten hinein. Dies ist Neuigkeit Nummer 1.<br /><a href="/neues/index.php#new1">Link zur Neuigkeit</a>
      </p>
      <p>				
      <strong>10.12.05</strong><br />
      Und dann ist das die Neuigkeit 2. Danach viel Blabla. Hier nur zu Demozwecken.<br /><a href="/neues/index.php#new2">Link zur Neuigkeit</a>
      </p>
     </div>			
    </div>
    Ich habe einen Header-Bereich, dann einen Haupt-Bereich, in dem eine rechtsbündige Navigation ist und inks der Content-Bereich (s.o.). Die CSS-Anweisungen für das Beispiel sehen so aus:
    Code:
    /*inhalte*/
    #content{
    	margin-right: 220px;
    	padding: 10px 10px 10px 20px;	
    }
    
    .hallo{
    	background: #FFEEB6 url(../pics/hallo_ecke.gif) bottom right no-repeat;
    	border: 1px solid #FEC100;
    	-moz-border-radius:10px;
    	padding: 15px;
    	font-size: 110%;
    }
    
    #startnews{
    	background: #A7D8FF url(../pics/startnews.gif) left 2em  repeat-x;
    	width: 48%;
    	border: 1px solid #2A88D3;
    	-moz-border-radius: 0 0 10px 10px;
    	margin-bottom: 10px;
    	}
    #startnews h2{
    	background-color: #2A88D3;
    	color: #fff;
    	font-weight: bold;
    	font-size: 120%;
    	line-height: 1.5em;
    	margin: 0;
    	padding: 5px;
    	border-bottom: 1px solid #2A88D3;
    }
    #startnews p{
    	padding: 0 10px 10px 10px;
    }
    
    #starttermine{
    	background: #B5E386 url(../pics/starttermine.gif) left 2em  repeat-x;
    	width: 48%;
    	border: 1px solid #3E7506;
    	-moz-border-radius: 0 0 10px 10px;
    	float: right;
    	margin-bottom: 10px;
    	}
    #starttermine h2{
    	background-color: #51930D;
    	color: #fff;
    	font-weight: bold;
    	font-size: 120%;
    	line-height: 1.5em;
    	margin: 0;
    	padding: 5px;
    	border-bottom: 1px solid #3E7506;
    }
    #starttermine p{
    	padding: 0 10px 10px 10px;
    }
    /*inhalte ende*/
    Und was macht Safari? Er ignoriert alles Anweisungen für den Content-Bereich. Folge: Header und Navigation sind "gestylt", mein Hallo-Text, die News und die Termine sind ohne jeglichen Style. Nackig! kopfkratz :mad: Sowas habe ich noch nie erlebt. Ihr?

    Ach ja, unter dem Haupt-DIV ist noch eine UL, die wird auch nicht gestylt. *argh*

    Grüße
    SB
     
    SilentBob, 20.12.2005
    #1
  2. msslovi0

    msslovi0 MacUser Mitglied

    Mitglied seit:
    20.03.2005
    Beiträge:
    2.714
    Zustimmungen:
    115
    Ich kann jetzt in der Darstellung von Firefox und Safari nicht so den Unterschied feststellen, auch wenn jigsw.w3.org keine allzu hohe Meinung von deinem CSS hat...

    Matt
     

    Anhänge:

    • Bild-1.png
      Dateigröße:
      23,5 KB
      Aufrufe:
      50
    msslovi0, 20.12.2005
    #2
  3. SilentBob

    SilentBob Thread Starter MacUser Mitglied

    Mitglied seit:
    01.02.2005
    Beiträge:
    360
    Zustimmungen:
    0
    Der Screenshot ist mit Safari gemacht?
    Dass die CSS nicht gemocht wird, weiß ich, verstehe ich aber nicht so ganz. Dabei sind das noch nicht einmal so wilde Sachen. Weiß nicht, was er z.B. an einer Anweisung wie dieser zu meckern hat: background: no-repeat left 50% url(foo.gif); :mad: :confused:
     
    SilentBob, 20.12.2005
    #3
  4. acid

    acid MacUser Mitglied

    Mitglied seit:
    18.08.2005
    Beiträge:
    472
    Zustimmungen:
    0
    schreibs doch mal einzeln aus:

    background-repeat: no-repeat;
    background-position: left 50%;
    background-image: url(foo.gif);
     
    acid, 20.12.2005
    #4
  5. msslovi0

    msslovi0 MacUser Mitglied

    Mitglied seit:
    20.03.2005
    Beiträge:
    2.714
    Zustimmungen:
    115
    Ja, sorry, sieht man nicht mehr, nachdem ich den beschneiden musste.

    Es geht nicht um wilde Sachen. Es geht um Sachen, die es nicht gibt, wie etwa -moz-border-radius.

    Das 50% (oder aus deinem obigen Code das 2em). Es gibt keine solchen Angaben für 'background'. Ich wüßte auch nicht, für was die gut sein sollen.

    Matt
     
    msslovi0, 20.12.2005
    #5
  6. msslovi0

    msslovi0 MacUser Mitglied

    Mitglied seit:
    20.03.2005
    Beiträge:
    2.714
    Zustimmungen:
    115
    Das macht's nicht richtiger ;-)
    Aber ja, es hilft, den Fehler einzugrenzen.

    Matt
     
    msslovi0, 20.12.2005
    #6
  7. SilentBob

    SilentBob Thread Starter MacUser Mitglied

    Mitglied seit:
    01.02.2005
    Beiträge:
    360
    Zustimmungen:
    0
    1) Das mit dem 50% ist dafür da, dass das Hintergrundbild auf der Y-Achse immer mittig ist, egal, wie groß ich die Schrift ziehe. Das kann man - eben mal gemacht - auch mit center ersetzen. Dann meckert er (bei mir) nicht mehr.

    2) Ich habe meinen Fehler gefunden. :rolleyes: Ich hatte noch überflüssige CSS-Anweisungen mit Kommentaren drin, die ich wiederum auskommentiert hatte. Und sowas wie /* color: #000; /*nur fuer IE*/ */ mag der Safari wohl nicht. *flöt*

    Trotzdem Danke fürs Schauen. wavey

    SB
     
    SilentBob, 20.12.2005
    #7
  8. pichfl

    pichfl MacUser Mitglied

    Mitglied seit:
    03.08.2005
    Beiträge:
    134
    Zustimmungen:
    2
    falsch.


    was man aber nicht machen darf, ist angaben mischen.

    daher:
    center & 50% zusammen geht ned
    man muss sich für eines entscheiden.

    (schau mal bei css4you.de, welche kombis erlaubt sind, ein paar gehen)
    (und für die, dies nicht wissen: damit kann man einen Hintergrund ausrichten.)
     
    pichfl, 20.12.2005
    #8
  9. SilentBob

    SilentBob Thread Starter MacUser Mitglied

    Mitglied seit:
    01.02.2005
    Beiträge:
    360
    Zustimmungen:
    0
    Das mit dem center - ich war schneller. :)

    Mal etwas anderes zum Thema: Wenn ich in einer CSS-Anweisung für die verschiedenen IEs habe (Hacks), die ja immer eine falsche Syntax aufweisen müssen, dann ist es natürlich klar, dass jeder Validator mir dafür an die Kehle springt. In allen standartkonformen Browsern sieht es richtig aus, in den entsprechenden IEs *würg* sieht es dank der falschen Syntax dann auch richtig aus. Ein Dilemma. Oder wie umgeht Ihr das?
     
    SilentBob, 20.12.2005
    #9
  10. msslovi0

    msslovi0 MacUser Mitglied

    Mitglied seit:
    20.03.2005
    Beiträge:
    2.714
    Zustimmungen:
    115
    Man lernt nie aus ;-) Das kommt davon, wen man nie was anderes außer left, center, right etc. verwendet...


    Matt
     
    msslovi0, 20.12.2005
    #10
Die Seite wird geladen...
Ähnliche Themen - Safari ignoriert CSS
  1. iphonenewbie
    Antworten:
    5
    Aufrufe:
    138
  2. dennz2017
    Antworten:
    2
    Aufrufe:
    305
    wegus
    10.04.2017
  3. WoKl
    Antworten:
    1
    Aufrufe:
    288
    Difool
    05.10.2016
  4. MacBlu
    Antworten:
    0
    Aufrufe:
    363
    MacBlu
    13.10.2015
  5. MACsuperstar
    Antworten:
    8
    Aufrufe:
    1.106
    MACsuperstar
    10.10.2014