html - Slider cuts off [flex slider] with bootstrap?

Question

my slider cuts off and I noticed wwhat causing it is boostrap, the framework i use for the grid system.

http://jsfiddle.net/5q39A/1/

Why acutally does it cuts off? I included all css meaning with boostrap too.

this is the boostrap website: http://twitter.github.com/bootstrap/

You can see the slider cuts off there:

http:// justxp.plutohost.net /survive/index.html

any help would be appreciated! thanks!

Answer 1

This is what is causing the issue:

li {
line-height: 18px;
margin: 5px;
}

on line 545 of bootstrap.css

Use this example to override:

Change this:

.flexslider .slides > li {
display: none;
-webkit-backface-visibility: hidden;
}

on line 327 of style.css

To this:

.flexslider .slides > li {
display: none;
-webkit-backface-visibility: hidden;
margin:0 !important;
}

Fiddle: http://jsfiddle.net/5q39A/4/