bootstrap help

[jameshumphries47]

i cant for the life of me work out why if you use the next button it wont loop round and go back to the first picture, but the previuos button works fine!

<div class="container">			<div class="carousel slide" data-ride="carousel" id="carousel-ex">				<ol class="carousel-indicators">					<li data-target="#carousel-ex" data-slide-to="0" class="active"></li>					<li data-target="#carousel-ex" data-slide-to="1"></li>					<li data-target="#carousel-ex" data-slide-to="2"></li>				</ol>				<div class="carousel-inner">					<div class="item active">						<img src="desktop.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="dropbox.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="temp.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<a href="#carousel-ex" class="left carousel-control" data-slide="prev">						<span class="glyphicon glyphicon-chevron-left"></span>					</a>					<a href="#carousel-ex" class="right carousel-control" data-slide="next">						<span class="glyphicon glyphicon-chevron-right"></span>					</a>				</div>			</div>		</div>

[jameshumphries47]

--bump--

[Mr_KoKa]

Move carousel controls <a> tags upper of DOM tree, so they wont be inside div.carousel-inner and it will work as expected.

 

I mean something like this:

                                <div class="carousel-inner">					<div class="item active">						<img src="desktop.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="dropbox.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="temp.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>				</div>				<a href="#carousel-ex" class="left carousel-control" data-slide="prev">					<span class="glyphicon glyphicon-chevron-left"></span>				</a>				<a href="#carousel-ex" class="right carousel-control" data-slide="next">					<span class="glyphicon glyphicon-chevron-right"></span>				</a>

[jameshumphries47]

 

Move carousel controls <a> tags upper of DOM tree, so they wont be inside div.carousel-inner and it will work as expected.

 

I mean something like this:

                                <div class="carousel-inner">					<div class="item active">						<img src="desktop.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="dropbox.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>					<div class="item">						<img src="temp.png" alt="image">						<div class="carousel-caption">							<h2>This is the heading</h2>							<p>This is the paragraph</p>						</div>					</div>				</div>				<a href="#carousel-ex" class="left carousel-control" data-slide="prev">					<span class="glyphicon glyphicon-chevron-left"></span>				</a>				<a href="#carousel-ex" class="right carousel-control" data-slide="next">					<span class="glyphicon glyphicon-chevron-right"></span>				</a>

ohhh... i see! thank you very much!  i was so stuck on it