EchtFettigerKeks
EchtFettigerKeks

Reputation: 1893

Bootstrap: Own classes necessary?

Im wondering how to use the bootstrap framework in a proper way.

I have a row with just one col-lg-12. I just want to hold a list with divs so I thought it would be best to include one row for each "row" with alway just one colum. However: Within that col's Im positioning the content with my own classes via absolute positioning.

My problem now: When resizing the window its ends up in a mess because its not responisble. Sure I could override my own absolute-classes with media-queries for each display-case but is this a good approach? Is there a way to only use bootstrap within the div?

The Image shows the div with the absolute content. The whole div (with the glowing border) is the colum (col-lg-12). inner content

Upvotes: 0

Views: 28

Answers (1)

Xposedbones
Xposedbones

Reputation: 597

I would consider using bootstrap classes for your div but only so they get the correct width for responsiveness. If the top div is set to position:relative the child divs will react correctly when resizing

Or you could rethink your approach, according to this image, you don't really need to use absolute positioning to achieve this layout.

Something like this could work

<div class="col-lg-12">
    <div class="col-xs-9"> <!-- Left col -->
        <div class="top"></div>
        <div class="bottom"></div>
    </div>
    <div class="col-xs-3"> <!-- right col -->
        <div class="fullHeight"></div>
    </div>
</div>

Upvotes: 1

Related Questions