Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „[IE 7/8] filter: Shadow verändert margin“

afr0kalypse

Allwissendes Karmameerschweinchen!

Moin zusammen.
Ich möchte gerne mit CSS Schatten darstellen.
Mit dem IE lässt sich das ja nur mit den filter: Parametern machen.

Ich habe 3 Div Boxen in einem Div Container die horizontal zentriert sind und nebeneinander floaten.
In allen Browsern sieht alles gleich aus, bis ich den Schatten benutze. Dann hat der IE 7/8 (andere konnte ich gerade nicht testen) plötzlich Schatten mit ca 10px margin links und rechts, was mir das Layout zerschießt.

Was kann ich tun?

Hier noch der Cote:
HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
    <div id="container">
        <div id="left">
        </div>
        <div id="content">
        </div>
        <div id="right">
        </div>
        <div id="clearboth">
        </div>
    </div>
</body>
</html>
--------
style.css:

* {
    margin:0;
    padding:0;
}
#container {
    width:800px;
    margin:0 auto;
    background-color:#bbb;
    min-height:400px;    
}
#left, #content, #right {
    float:left;    
    overflow:hidden;
    -moz-box-shadow:0 0 10px #333;
    -webkit-box-shadow:0 0 10px #333;
    box-shadow:0 0 10px #333;
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=0, Strength=6)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=45, Strength=4)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=90, Strength=6)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=135, Strength=4)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=180, Strength=6)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=225, Strength=4)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=260, Strength=6)
        progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=305, Strength=4);
}
#left, #right {
    width:140px;
    height:200px;
    background-color:#888;        
}
#content {
    width:440px;
    height:200px;
    background-color:#666;
}

Alternativ hab ich das auch hier hochgeladen:

Ich hoffe mir kann jemand sagen, wie ich das korrigieren kann :)
 

pixelpur

Nicht mehr ganz neu hier

AW: [IE 7/8] filter: Shadow verändert margin

Probiere es mal, dass du dir einen Corpus und einen Wrapper einsetzen, bei vielen Themen die mit dem verschieben zu tun haben hilft dies oft weiter.

#container { width:800px; margin:0 auto; background-color:#bbb; min-height:400px; }

#container2 { width:800px; background-color:#bbb; min-height:400px;
float:left;
}
 
K

kyle66

Guest

AW: [IE 7/8] filter: Shadow verändert margin

Hi,

evtl. könntest du mit Conditional Comments arbeiten und den Elementen im IE7-8 einen negativen margin zuweisen.

bei mir sieht’s mit margin: -13px -13px -14px -13px; ganz ok aus

Grüße
Kyle
 
Zuletzt bearbeitet von einem Moderator:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.182
Beiträge
2.582.044
Mitglieder
67.255
Neuestes Mitglied
Bitterlimoni
Oben