Question

If I use progress bar, next contents appears in progress bar.
I want next contents on the bottom of progress bar with 50px margin.
How can I fix this?

DEMO: http://jsfiddle.net/VwmqV/

HTML

You are logged in

    <div class="progress progress-striped active"><div class="bar" style="width: 53%"></div>
    This message should be on the bottom of progress bar
</div>

CSS

It’s way too long so please take a look at JS fiddle demo

Answer 1

Your text is part of the first <div> which is the container of the progress bar. Place it after the <div>. So you should have this instead:

<div class="progress progress-striped active">
    <div class="bar" style="width: 53%"></div>
</div>
This message should be on the bottom of progress bar