My site is not responsive, it's just text [closed]

-1

My site is not responsive, it's just text:

<div class="container">
    <div class="row col-sm-6 col-xs-12 col-lg-12">
        <h1 class="text_header">I’m Gustavo Marinho,<br> Creative Designer —<br>Product Designer <br>at Netshow.me</h1>
    </div>
</div>

<div class="container">
    <div class="row col-sm-6 col-xs-12 col-lg-12">
        <h2 class="text_1"> human-centered <strike>design</strike> human<br> I believe we can create change<br> through design.</h2>
    </div>
</div>

<div class="container">
    <div class="row col-sm-6 col-xs-12 col-lg-12">
        <h3 class="text_2"> My dream is to develop innovative solutions that go beyond the boundaries<br> between art, design and technology to solve problems that impact people's lives.</h3>
    </div>
</div>
    
asked by anonymous 29.04.2018 / 17:15

1 answer

1

I believe that what you want to do is this (considering only the excerpt presented):

<div class="container">
    <div class="row">
        <div class="col-sm-12 col-md-6 col-lg-4">
            <h1 class="text_header">I’m Gustavo Marinho,<br> Creative Designer —<br>Product Designer <br>at Netshow.me</h1>
        </div>
        <div class="col-sm-12 col-md-6 col-lg-4">
            <h2 class="text_1"> human-centered <strike>design</strike> human<br> I believe we can create change<br> through design.</h2>
        </div>
        <div class="col-sm-12 col-md-6 col-lg-4">
            <h3 class="text_2"> My dream is to develop innovative solutions that go beyond the boundaries<br> between art, design and technology to solve problems that impact people's lives.</h3>
        </div>
    </div>
</div>

So it will have a dynamic layout occupying the 12 grid spaces in small resolutions (one per line), 6 medium resolution spaces (two per line) and four high resolution spaces (three per line).

p>

If in doubt, take a look at Bootstrap's grid system documentation, examples are quite useful.

    
29.04.2018 / 18:43