[TYPO3-german] CSS3 und Schatten

LUCOMP mediale kommunikation & internetDesign Bernhard Ludwig lucomp at lucomp.de
Fri Aug 3 18:09:58 CEST 2012


> -----Ursprüngliche Nachricht-----
> Von: typo3-german-bounces at lists.typo3.org [mailto:typo3-german-
> bounces at lists.typo3.org] Im Auftrag von Björn Hahnefeld
> Gesendet: Freitag, 3. August 2012 17:55
> An: typo3-german at lists.typo3.org
> Betreff: [TYPO3-german] CSS3 und Schatten
> 
> Hallo zusammen,
> 
> 
> 
> ich brauche nur rechts und links einen schönen Schatten, nicht aber
> oben und unten. Ich habe schon mit meinem CSS-Quelltext experimentiert
> wie ich wollte... doch es will nicht L.
> 
> 
> 
> Sieht jemand von euch, woran dies liegen könnte?
> 
> 
> 
> --
> 
>   -moz-box-shadow: 5px 5px 5px #e2e2e2; /* FF3.5+ */
> 
>   -webkit-box-shadow: 5px 5px 5px #e2e2e2;/*Saf3+, Chr*/
> 
>   box-shadow: 5px 5px 5px #e2e2e2; /*Op10.5, IE 9, FF4*/
> 
>   filter:progid:DXImageTransform.Microsoft.Shadow (color=#e2e2e2,
> Direction=135, Strength=5); /* IE6-7 */
> 
>   -ms-filter:"progid:DXImageTransform.Microsoft.Shadow (color=#e2e2e2,
> Direction=135, Strength=5)"; /* IE8 */
> 
>   zoom:1; /* trigger hasLayout */
> 
> --
> 
> 
> 
> Viele Grüße
> 
> 
> 
> Björn

Hallo Björn,

Du musst einen zweiten Schatten definieren, weil Du mit den Angaben nur das
Offset der Box vom 0-Punkt links-oben ansprichst (Von dort aus nach rechts,
nach unten). Das heißt, mit einer ersten Definition legst Du den Schatten
nur nach rechts (8px, 0px) und mit einer zweiten Definition einen zweiten
Schatten nach links (-8px, 0px). Beispiel:

#test {
    box-shadow: 8px 0px 8px black,
               -8px 0px 8px black,
}

Hoffe, es hilft.

Viele Grüße,
Bernhard Ludwig



More information about the TYPO3-german mailing list