Der Code sieht so aus
<!DOCTYPE html> <html> <head> <title>foo</title> <meta charset="UTF-8"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> <style type="text/css"> html {background-image: url(flag-s.png);background-size: cover} </style> </head> <body> </body> </html>
Chromium (30x, Linux) stellt es wie gewünscht dar, Firefox (24.0), Opera (12.16) und webkit-gtk (dwb) jedoch nicht. Die drei fangen außen am Rand jeweils mit der richtigen Farbe an und bringen dann einen Verlauf nach weiß zur Mitte hin, wo es in einem dünnen, weißen Streifen endet.
Statt 'cover' hab ich's auch mit '100%' probiert, liefert jedoch das selbe Ergebnis. Ist nun was an meinem Code auszusetzen bzw. gibt es eine besser funktionierende Lösung?
Edit, gewünscht ist eine möglichst komplex-freie Lösung für alle modernen Browser, inkl. IE>=7, idealerweise ohne JS.
Dieser Beitrag wurde von ph030 bearbeitet: 26. September 2013 - 00:08