menü

status

online seit 6241 tagen
letztes update am
28. November, 14:45

kalender

Februar 2005
Mo
Di
Mi
Do
Fr
Sa
So
 
 4 
 5 
 7 
 8 
19
 
 
 
 
 
 
 

aktuelles

Ich lebe noch!
nighthawk - 28.11. 14:45
Nach langer Zeit ...
nighthawk - 04.10. 23:09
Lösungen vom draufgucken
nighthawk - 27.02. 22:30
Mal 'was neues
nighthawk - 26.01. 22:29
Ganz Münster auf dem Aasee
nighthawk - 11.01. 20:17

historisches

suche

 

buttonmania

xml version of this page

paRSS - Feews! for the rest of us

startseite > einträge > Bilderrahmen mit CSS

Montag, 28. Februar 2005

Bilderrahmen mit CSS


mangels interessanter news schreibe ich mal, womit ich mich sonst so zwischendurch immer mal beschaeftige..

mir ist vor ein paar tagen im blog "nutzloses wissen" aufgefallen, dass die ganzen bilder, die der kollege einstellt, so nette weisse rahmen mit grauem rand haben.. der firefox surfer wird jetzt denken "na und? sind doch nichts besonderes? hat jede zweite webseite.." - aber ich surfe fuer gewoehnlich mit dem internet explorer und da sind mir diese rahmen noch nicht so haeufig begegnet.. erst dachte ich, dass seine blogsoftware um die bilder einfach weisse rahmen drumherum macht. dafuer sprach z.b. das, wenn man die bilder markiert hat, immer auch der rahmen mitmarkiert wurde.. dagegen sprach dann aber eindeutig, dass der rahmen fehlte wenn man das bild auf die festplatte gespeichert hat. ;)
also mal den source inspiziert.. stand nichts besonderes bei dem bild dabei, ausser einer css-klasse fuer die ausrichtung.. danach mal ins stylesheet geschaut und sofort den betreffenden code entdeckt..

img {
  padding: 5px;
  background: #fff;
  border: 1px solid #ccc;
  border-style: solid;
  margin: 10px;
  max-width: 100%;
}

sehr schoen, dachte ich mir.. das ist ja einfacher als vermutet diese rahmen zu machen.. code genommen, ein wenig abgeaendert (damit es etwas besser zu dieser seite passt) und in das stylesheet hier reinkopiert.. und was passiert? nichts.
der graue rand ist, wie bei so vielen anderen webseiten die ich kenne, direkt am bild dran.. kein schoener weisser rahmen drumherum, der aussen nur mit grau abgesetzt wird. also wieder ins andere stylesheet.. gesucht, gesucht, kopiert, mehr kopiert und der rahmen war immernoch nicht zu sehen.
hinterher hatte ich einen eintrag und das komplette stylesheet der seite kopiert - natuerlich den head-bereich weggelassen - und trotzdem war das bild ohne rahmen.. alles andere war identisch. das wurde mir dann doch langsam suspekt.. was das denn wohl fuer wundercode auf der seite ist.. nach 'ner weiteren halben stunde rumforschen habe ich dann festgestellt, dass der fehler im
<?xml version="1.0" encoding="utf-8"?>
liegt.. bzw. dessen positionierung im html source. packt man den xml container (oder wie das ding auch immer heisst) vor den doctype, schaltet der internet explorer in den quirks-modus. laesst man den xml container weg oder tut ihn hinter den doctype, interpretiert der IE die seite im strict-modus. und in genau diesem strict modus erscheinen dann auch die weissen rahmen um die bilder.
da sage ich nur: danke, bill gates. du hast mich nur schlappe 1.5 stunden meines lebens gekostet bei der suche, wieso eine padding-angabe bei einem img tag mal interpretiert wird und mal nicht.