Stack Overflow
Stack Overflow

Questions tagged [box-shadow]

The box-shadow CSS property describes one or more shadow effects as a comma-separated list. It allows casting a drop shadow from the frame of almost any element and allows for shadow rounded corners by border-radius.

The box-shadow CSS property describes one or more shadow effects as a comma-separated list. It allows casting a drop shadow from the frame of almost any element. If a border-radius is specified on the element with a box shadow, the box shadow takes on the same rounded corners (see Mozilla docs).

Further reference:

  1. W3C reference.
  2. Mozilla reference
393 questions
0
votes
0 answers

drop shadow not appearing on image

I'm not sure why this isn't working. I've never had problems with drop shadows before. I have an image set to position: relative, because there's an item below it (using z-index), and another above it (also using z-index. I might add that the image…
Laura Sage
  • 33
  • 7
0
votes
1 answer

How to add box shadow to kendo mobile drawer?

I am using Kendo angular mobile Drawer. I want to add the box shadow to drawer. How do I add box shadow to drawer?
RohitK
  • 1,444
  • 1
  • 14
  • 37
0
votes
1 answer

Box-shadow not looks same for both safari and chrome

I have given box shadow effect for a DIV. But the same code looks darker in safari and thinner in chrome. The shadow not appear in left and top for chrome browser. .div_wrapper { box-shadow: 4px 4px 15px -6px black; -moz-box-shadow: 4px 4px…
Jayabharathi Lakshana
  • 41
  • 5
0
votes
0 answers

Image reacts weird on hover of parent, caused by inset box-shadow of parent

I have a parent element with a hover effect (box shadow). When you hover over the parent: PARENT:hover then this child image (IMG) reacts very weird in Internet Explorer: PARENT / DIV_6 / a / IMG This is a simple illustration of the elements…
Cinzel
  • 215
  • 3
  • 13
0
votes
1 answer

Adding box shadow on "custom shaped div" with low z-index

I am not sure if this is even remotely possible, or if i possibly have to rewrite a lot of my code, but anyway; here goes: If you take a look at the below picture, what i want to achieve is the middle button (green one) in the navigation bar to drop…
Jonas Mohr Pedersen
  • 427
  • 7
  • 19
0
votes
1 answer

Trying to get a slight page curl box shadow on CSS-animated div

What I'm hoping to do is get one of those nice page lifts/curls on a div that has a hover animation, so that the slight page corner curl stays with the div even as it animates. I've tried using/including code examples from…
Hideto
  • 309
  • 1
  • 3
  • 14
0
votes
3 answers

CSS box-shadow weirdness in Firefox

I have a weird issue when using box-shadow to apply a padding to the left and right side of a span which has its contents wrapping inside a container: box-shadow:9px 0px 0px red, -9px 0px 0px red; It applies the left shadow only to the first line,…
Skynet
  • 558
  • 3
  • 16
0
votes
1 answer

How to get multiple bottom only borders on a circle

I have 2 divs with some content. One "box" and one "circle" now I want to make them look like one figure only. Something like a box with a circled part at the bottom center. Hard to explain it in words I guess showing up some code is way…
Patrick
  • 25
  • 3
0
votes
1 answer

box-shadow vs display:inline-block vs display:inline - interesting behaviour

I've just run into an interesting problem. I have 3 divs positioned next to each other with display:inline-block and with width:32%. All of them has a button inside which have box-shadow sets. Output: https://i.stack.imgur.com/whdXa.jpg As you can…
err
  • 109
  • 2
  • 7
0
votes
1 answer

css 3 box shadow left top bottom

hey guys i was playing around with css box-shadow property and I'm struggling with it a little bit. Im trying to create shadow on a box but I want to apply shadow only on the top,bottom and left side of my div. here is my css code until now but it…
Mll
  • 63
  • 2
  • 8
0
votes
1 answer

Android and box shadow property

I have the following code to make a box shadow: box-shadow: inset 0 0 20vw 0 #000; It will not work on Android. I am running 4.4.2 and Chrome 45.
tester123
  • 1,033
  • 2
  • 12
  • 17
0
votes
1 answer

CSS3 filter:opacity(X) with fallback to opacity:X, same for filter:drop-shadow() to box-shadow

I would like to start using the CSS3 filter:opacity() and filter:drop-shadow() properties that are currently under development, as I read that they are hardware accelerated in some browsers on some machines. But at this early point I definitely need…
Jpsy
  • 20,077
  • 7
  • 118
  • 115
0
votes
1 answer

Is there a way to automatically start css transitions or animations on page load?

I want to change my box shadow from yellow to black and yellow again and just repeat that process. I don't mind if someone gives me a java script answer I just wanna know how to do it.
user4975683
0
votes
3 answers

Add box-shadow to table except first cell

I have a simple table, with a box-shadow, but I want to exclude the very first cell from any shadow. I've tried adding box-shadow: none to that cell but it doesn't override the shadow on the whole table. I'm not even sure if this is…
StudioTime
  • 22,603
  • 38
  • 120
  • 207
0
votes
1 answer

Box-shadow and overflow: scroll

I am using 3 bootstrap panels with panel headings col-md-4, at the bottom of each panel I have box-shadow and the panels have a max height of 300px. The text inside the panels is longer than the panels themselves. I would like to use overflow:…
Jason
  • 89
  • 9
1 2 3
…
26 27