How to make a page with full blocks using bootstrap?

Asked

Viewed 303 times

2

I need to do something with the image, using bootstrap.

Has anyone ever been through it? Have any idea how to do it?

inserir a descrição da imagem aqui

html css css3 twitter-bootstrap

2 answers

1

There are a few ways to do this. The one I used was to create a general container with the class container-fluid which causes the div occupy all space of the screen. In parts that the line should not be seve full-width used a col-md-10 [for example] offset by 1.

No Plunker.

Obs1: Using Bootstrap 4, but the solution for other versions is easily adapted.

Obs2: The visualization can be opened in responsive mode, can move the will to see the behavior, mainly with the page 'complete'.

  • Got it, only this way the content does not respect the main container right?

  • If I misunderstood what you meant, the content will respect their respective rows and divs. The conteiner is only a "packaging" for the contents.

0

Have you ever used Materialize? I think it best to create these types of blocks...

However in Bootstrap you can distribute the cells you want inside the container of the size you want. Example:

<div class="container">
<div class="row">
    <div class="col-md-6"></div>
    <div class="col-md-6"></div>
</div>
</div>

Then just style with CSS.

Browser other questions tagged html css css3 twitter-bootstrap

You are not signed in. Login or sign up in order to post.