section does not work correctly

Question

section does not work correctly

Navigation

#1 by (2 votes)

1

I need my <section> to look like this site here follow the image of the part I need

ItriedcodingbutitdoesnotstaythatwayIdonotknowwhereI'mgoingwrong.

Followmycode:

CSS

ulli{list-style-type:none;}.imagem{background-image:url(http://nerdreactor.com/wp-content/uploads/2013/09/destiny_thumbnail-500x300_c.jpg);background-size:cover;padding-top:59.42%;}.infoli{width:33.3333%;float:left;box-sizing:border-box;padding-left:5px;padding-bottom:5px;}.text{background-color:lime;height:320px;}.textp{width:300px;max-width:95%;text-align:left;}

HTML

<sectionid="info-geral">
  <ul class="info">
    <li>
      <div class="imagem">
        <div class="text">
          <h3>DEI UMA ATUALIZADA CONFORME FUI MECBHENDO AQUI</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
      </div>

    </li>


  </ul>
</section>

NOTE: I was moving here and gave an update gave an improvement even more I think it is not correct

html html5 css

asked by anonymous 30.07.2015 / 19:43

1 answer

What are the get and set methods in a String array? Get first line element and last

score 2 · Accepted Answer

As I understand it, all you have to do is add more elements li inside the ul tag.

ul li {
  list-style-type: none;
}
.imagem {
  background-image: url(http://nerdreactor.com/wp-content/uploads/2013/09/destiny_thumbnail-500x300_c.jpg);
  background-size: cover;
  padding-top: 59.42%;
}
.info li {
  width: 33.3333%;
  float: left;
  box-sizing: border-box;
  padding-left: 5px;
  padding-bottom: 5px;
}
.text {
  background-color: lime;
  height: 320px;
}
.text p {
  width: 300px;
  max-width: 95%;
  text-align: left;
}

<section id="info-geral">
  <ul class="info">
    <li>
      <div class="imagem">
        <div class="text">
          <h3>DEI UMA ATUALIZADA CONFORME FUI MECBHENDO AQUI</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
      </div>

    </li>
<li>
      <div class="imagem">
        <div class="text">
          <h3>DEI UMA ATUALIZADA CONFORME FUI MECBHENDO AQUI</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
      </div>
      </li>
      <li>
      <div class="imagem">
        <div class="text">
          <h3>DEI UMA ATUALIZADA CONFORME FUI MECBHENDO AQUI</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
      </div>
      </li>
  </ul>
</section>