How do I add article block in my section tag?

Question

How do I add article block in my section tag?

Navigation

#1 by (0 votes)

0

I'm having trouble adding a section tag where you have 3 squares next to each other.

<section id="blocos">
    <div class="bloco-coloridos">
        <h3>Vermelho</h3>
        <h4>Azul</h4>
        <h5>Verde</h5>
    </div>
</section>

Now in css I'm programming as follows:

section#blocos{
    display: block;
    text-align: center;
}

section#blocos .blocos-coloridos{
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 1% 0;
    padding: 2% 2%;
}

html5 css3

asked by anonymous 17.04.2016 / 18:18

1 answer

AspNet dynamically change textBox characteristics I can not make fluid layout in the menu

score 0 · Answer 1

Just give float: right; in the inner elements of div #bloco-coloridos , I've even added a width: 33.33% that divides exactly the same space into three parts!

.bloco-coloridos > div{
  width: 33.33%;
  float: right;
}

#vermelho {
  background-color: red;
}

#azul {
  background-color: blue;
}

#verde {
  background-color: green;
}

<section id="blocos">
  <div class="bloco-coloridos">
    <div id="vermelho">Vermelho</div>
    <div id="azul">Azul</div>
    <div id="verde">Verde</div>
  </div>
</section>