Bootstrap slider buttons not working in Firefox or IE

[iangdesign]

The carousel on the home page has two links in it that do not seem to work in Firefox or IE. Works fine in Chrome and Safari. I can’t figure out why they are not working. Any help would be appreciated.

<!--main slider-->

    <div id="myCarousel" class="carousel slide">
    <ol class="carousel-indicators">
        <li class="active"></li>
        <li class=""></li>
    </ol>
    <div class="carousel-inner">
        <div class="item active">
            <img src="images/slider/triangles_teal.png" alt="" class="">



            <div class="carousel-caption">
                <h2 class="">Consumer Experience Survey</h2>
                <p class=""><span class="slideshow-text">
                   The true measure of your organization’s success is the satisfaction of its consumers. uSPEQ is their voice.
                </span></p>
                <button type="button" class="btn btn-primary btn-md outline"><a href="consumer.html">Learn more →</a></button>
            </div>
        </div>
        <div class="item">
            <img src="images/slider/triangles_purple_1.png" alt="" class="">
            <div class="carousel-caption">
                <h2 class="">Employee Climate Survey</h2>

                <p class=""><span class="slideshow-text">
                    Your employees implement your mission and drive your service delivery. 
                    A checkup on their work environment—as they experience it—is a wellness check on your organization.
                    </span></p>
                <button type="button" class="btn btn-primary btn-md outline"><a href="employee.html">Learn more →</a></button>
            </div>
        </div>
    </div>    

    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>

    <a class="right carousel-control" href="#myCarousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>


</div>

<!--end main slider-->   

[JeroenR]

Maybe you can use just the anchor element? So <a class="btn btn-primary btn-md outline" href="consumer.html">Learn more →</a> instead of <button type="button" class="btn btn-primary btn-md outline"><a href="consumer.html">Learn more →</a></button>. Then it will work.

[Author]

Posts