[Solved] How to add rounded corners to carousel slide

[Historical Forums User]

I’m trying to add rounded corners to a bootstrap carousel, but it’s not working as expected. I created a class named rounded:
_
[MOD EDIT – Codedump Removed]_

At first when the page loads there are no rounded corners, but if you hover over the image they appear. Not sure why this is happening. I have tried adding the .rounded class to a bunch of different blocks to no avail.

Any ideas?

link here…

[Historical Forums User]

sorry i don’t know why the html is not displaying correctly :(

[Paulie_D]

The rounding is there but the background color(s) of the controls is hiding it.

Try adding this

.carousel-control {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 15%;
opacity: .5;
filter: alpha(opacity=50);
font-size: 20px;
color: #fff;
text-align: center;
text-shadow: 0 1px 2px rgba(0,0,0,0.6);
border-radius: 9px; <---- or whatever 
}

[Historical Forums User]

Thanks Paulie, That did it. I think that was the only thing I didn’t attach .rounded to :)

One more thing…. If I wanted to add a drop shadow where do you think it should be added to?

[Paulie_D]

Drop shadow to what?

[Historical Forums User]

Never mind I got it. Thanks again for the help!

[Author]

Posts