html - Box-shadow being cut off for floating boxes next to each other -


the box-shadow of floating div cut off it's right neighbour, not on left side.

i played z-index , overflow: visible did not work.

html:

<div class="doc-page"></div> <div class="doc-page active"></div> <div class="doc-page"></div> 

css:

.doc-page {     float: left;     width: 141px;     height: 200px;     border: 1px solid black;     background-color: white; } .active {     box-shadow: 0 0 5px 5px #888; } 

result:
shadow cut off

fiddle: http://jsfiddle.net/au5lv/1/

z-index still answer, can apply z-index on element position:relative, or position:absolute.

so apply position:relative of elements, , apply z-index active one.


Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

How to get multiresult with multicondition in Sql Server -