Question

I'm using bootstrap v. 2.3.2 (ie7 reason), and would like to make a grid with one fixed column size (300px). I can do this when that col is first and in left column but I need it in the right side of page. I also found on stack some working examples, but in this examples the fixed column is first in page code and then floated to the right. Is it possible to make layoud where span300px will be the "last" and fixed size element (semantic reason)?

My code is very simple:

<div class="container">
  <div class="row-fluid">
        <div class="span8">
          ....
        </div>
        <div class="span300px">
          ....
        </div>
  </div>
</div>

When page will be displayed on smart-phone, that column will be hidden.

Thanks for any help.

Was it helpful?

Solution

Add custom class to your span.

html :

<div class="container">
  <div class="row-fluid">
        <div>
          ....
        </div>
        <div class="span3 fixed300">
          ....
        </div>
  </div>
</div>

css:

fixed300 {
    min-width:300px !important;
    max-width:300px !important;
    float:right !important;
    margin-left: 2em;
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top