Search code examples
cssshadowshadowbox

How do I indent without hiding parts of shadows?


I have content that I'd like to align vertically, so I'm using this simple class to indent:

.indent-1 {
    margin-left: 144px;
    overflow: hidden;
}

This works fine in most cases, but if I have a box with a drop shadow within the indented content, the overlfow: hidden hides part of the shadow.

Is there a way to accomplish this indentation without sacrificing shadows?

ANSWERED

Here is the complete style to get the desired effect, shadows intact:

.indent-1 {
    margin-left: 120px;
    padding-left: 24px; 
    /* margin + padding = 144 */

    overflow: hidden;
}

Solution

  • Add padding to indent-1.