Frage zu Div

[Ben]

Hallo,

ich hab hier diese div definition:

div{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent
}

und hier hab ich meine Klassen definiert

.drop-shadow {
position:relative;
float:left;
width:5%;
padding:1em;
margin:2em 10px 4em;
background:#fff;
-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.drop-shadow:before,  .drop-shadow:after {
content:"";
position:absolute;
z-index:-2;
}
.drop-shadow p {
font-size:16px;
font-weight:bold;
}

wenn ich jetzt <div class="drop-shadow"> Hello World </div> mache dann wird das nicht angewendet, kann ich bei der oberen div von vorher so Einstellen das die classe angewendet werden soll.

Danke Ben.

[suit]

ich hab hier diese div definition:

Das ist ein CSS-Deklarationsblock.

div-Elemente haben von natur aus kaum/keine Formatierung - jegliche Deklaration die du hier machst ist augenscheinlich sinnlos.

wenn ich jetzt <div class="drop-shadow"> Hello World </div> mache dann wird das nicht angewendet, kann ich bei der oberen div von vorher so Einstellen das die classe angewendet werden soll.

Was hast du eigentlich vor? Einen Schatten um irgendwas im Fließtext?

Ich habe so das Gefühl, dass du dich mit inline-block auseinandersetzen möchtest und in diesem Zusammenhang alles vergisst, was mit position oder Pseudoelementen zu tun hat.

<p>Ich bin ein <strong>Schatten</strong> meiner selbst</p>

strong {  
  display: inline-block;  
  padding: 0.25em;  
  vertical-align: middle;  
  box-shadow: 5px 5px 2px #FFFFFF;  
}

[Ben]

Hallo,

ich hab hier diese div definition:

div{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent
}

und hier hab ich meine Klassen definiert

.drop-shadow {
position:relative;
float:left;
width:5%;
padding:1em;
margin:2em 10px 4em;
background:#fff;
-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.drop-shadow:before,  .drop-shadow:after {
content:"";
position:absolute;
z-index:-2;
}
.drop-shadow p {
font-size:16px;
font-weight:bold;
}

wenn ich jetzt <div class="drop-shadow"> Hello World </div> mache dann wird das nicht angewendet, kann ich bei der oberen div von vorher so Einstellen das die classe angewendet werden soll.

Danke Ben

Also Problem war der Internet Explorer, über Mozilla gehts und ich denk jetzt einfach mal das du mir auch das, mit deiner gecrypteten Antwort sagen wolltest...

Danke Ben.

[suit]

Also Problem war der Internet Explorer, über Mozilla gehts und ich denk jetzt einfach mal das du mir auch das, mit deiner gecrypteten Antwort sagen wolltest...

Nein, ich wollte dir sagen dass dein Code katastrophaler Mist ist und du ihn besser wegwerfen solltest.