Sheldon
Sheldon

Reputation: 10097

Why is row-fluid being pushed over? (Bootstrap, CSS)

I have a page that looks great in high resolution (1st screenshot) but in low resolution (second screenshot) row-fluid is being pushed over (so it's not in line with the VG-ES list item). Is there a way to fix this?

My Markup:

<div class="container">
  <div class="row-fluid">
    <div class="span8">Calendar</div>
    <div class="span4">Event info</div>
  </div>
</div>

This is how it should look (1280 x 720): High

This is how it looks in low resolution (1152x720 or lower) Low

Upvotes: 0

Views: 1321

Answers (2)

David Taiaroa
David Taiaroa

Reputation: 25495

If the issue is that you want the calender to stay in the same position relative to the top menu, double check that the menu is also in a container > row-fluid grid. If it is, then try forcing the calendar to align left.

Good luck!

Upvotes: 1

Jake
Jake

Reputation: 1390

from the little experience I had with bootstrap this is just simply the way it is. bootstrap has some resolution key points defined through css media queries at the resolutions you mentioned. you can edit the css media queries to meet your own needs.

Upvotes: 1

Related Questions