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
1 answer

Fake CSS Inset (from above and below) With Adjacent Divs

I have three divs and want to "fake" an inset by casting shadows from outside (1px divs) into the larger middle div. I don't care if we use z-index or not (they could be floated) whatever you think is the best way to solve it.
PJ Brunet
  • 3,615
  • 40
  • 37
0
votes
2 answers

CSS box-shadow VS overflow hidden

I have created a carousel, and I'd like to add box-shadow property on the carousel items. This is not possible, because of the carousel's overflow:hidden property. Is there anyway to overcome that? Please check this fiddle *Carousel is not working…
zekia
  • 4,527
  • 6
  • 38
  • 47
0
votes
2 answers

3D Button effect with CSS Drop-shadow and transition

I'm trying to create set of 3d button effects with css-drop shadow and css transitions. I got everything working, it looks good, but when the button is clicked, the shadow moves towards to button, and I want it to stay in one place, and only for the…
Andor Nagy
  • 174
  • 4
  • 15
0
votes
1 answer

Preventing overlapping corners with multiple transparent box-shadows

Actual goal: Give tiles, some containing images, an engraved/embossed look using only CSS. Question: I'm attempting to use four inset box-shadows with transparency on a tile to create an engraved look. Unfortunately, the four translucent shadows…
Leaf
  • 552
  • 1
  • 4
  • 14
0
votes
2 answers

CSS Drop-Shadow on nav with background image

I've got a navigation bar at the top of the page that has a box-shadow, but it doesn't seem to apply to the section element below with a background url. If I comment out the background attribute, the drop shadow is apparent. Here is the…
Himmel
  • 3,629
  • 6
  • 40
  • 77
0
votes
2 answers

Putting a box-shadow around parent div of a list

I'm trying to put one continuous box shadow around the div with class "menu-item sub-menu", and all of its children. Right now it only seems to put the shadow behind the "About" item. HTML code:
0
votes
3 answers

box shadow in css

How can i get these spaces covered with this box shadow? CSS- .button { height:24px; width:120px; background:black; position:absolute; border-radius:2px; padding:3px; box-shadow:4px 4px 0px 0px #444; } Just a fiddle
Manoz
  • 6,507
  • 13
  • 68
  • 114
-1
votes
1 answer

How to move this box-shadow?

I'm a complete beginner when it comes to coding so I found this box shadow on the internet but don't know how to move it so it fits the font I'm using. heres the css for the title: .sidebar-title { position:absolute; z-index:150; …
mazedaven
  • 1
  • 2
-1
votes
3 answers

Can’t make box-shadow on bottom

I need box-shadow only in bottom of block and width need to be 100%. Box-shadow works if there is width with px but not works with 100% width. What is the problem?
R0b001
  • 3
  • 1
-1
votes
1 answer

Custom shadow with CSS

How do I make a shadow per the image below? I don't have any idea how to do that.
Khujand Nanocoding
  • 125
  • 1
  • 7
-1
votes
1 answer

Why box-shadow doesnt works in Safari, but in others browsers work?

Last time i code some css to my website, after tests I forward that in Safari (11.1.2) box-shadow doesn't works . I tried to add prefix -webkit but it doesn't works too. Do you have some idea how I can fix it?? box-shadow: 0 1px 7px 0 rgba(0, 0, 0,…
user11768519
-1
votes
1 answer

Why is box-shadow appearing below element like so

My box shadow added to this div element is appearing weirdly below the element for some reason. Below I have linked a codepen.io file in which my source is located. I'm having trouble using the UiKit slider while also retaining a box shadow around…
Kaden Nelson
  • 45
  • 8
-1
votes
2 answers

Hovering betweend images, box shadow CSS only

I have partially stacked two images using CSS Grid. The image that the user hovers over increases in z-index and therefore overlays the other. Users can switch back and forth between those two images. Now I am wondering if it's possible to give the…
Unknown User
  • 505
  • 1
  • 7
  • 19
-1
votes
2 answers

CSS transition for element A by hover element B

I have a vertical sidebar with buttons on it. By hovering a button, the button should ease out to right (for title text). I did that via "transition: with" nav#navi_side a { display:block; width:30px; height:30px; …
Froschkoenig84
  • 566
  • 4
  • 13
-1
votes
2 answers

Add box-shadow to bottom of div from middle

I've attached a preview of what I wanted. I honestly couldn't get the right words for it so I've got no luck searching how to do this. Thanks a lot.
phoenixWright
  • 77
  • 1
  • 12
1 2 3
…
26 27