Removing arrows in the Bootstrap carousel

Question

here is the main page of my blog www.lowcoupling.com I would not want to show the left and right arrows in the bootstrap carousel I tried

.glyphicon-chevron-right{
     display:none;
}

(same for left arrow) but it doesn't seem to work.

Answer 1

This will hide the buttons

.right.carousel-control, .left.carousel-control {
    display: none;
}

If you still want to be able to click the button, follow these steps:

.right.carousel-control, .left.carousel-control {
    opacity: 0;
    filter:alpha(opacity=0); /* IE support */
}

Answer 2

I took a quick gander and you are almost there, but Bootstrap css takes responsibility for your css. Bootstrap has:

.carousel-control .glyphicon-chevron-right{
    ...
    display:inline-block;
}

If you need to assign an arbitrary point value, Bootstrap provides "2 points" to provide an inline-block style.

css Bootstrap, ( Bootstrap 2 ), ".glyphicon-chevron-right" .

.carousel .glyphicon-chevron-right{display:none;}

, , "", ( 256)

#myCarousel .glyphicon-chevron-right{display:none;}

Answer 3

It will work

.right.carousel-control, 
.left.carousel-control 
{
     visibility:hidden;
}