Olá pessoal.
Nesta aula aprendemos a fazer um spot de outros sites para incorporar ao nosso.
O instrutor incorporou um "iframe" de video, e para ajustar a página ele criou uma "div" com classe "video". até aqui show :)
como curiosidade, fiz um teste colocando essa classe "video" direto no "ifreme", mas o comportamento não foi igual, na declaração margin: 1em auto;, o "auto" não levou o video para o centro como quando estava dentro da "div". Ai eu dei uma tela azul... rs!
Qual a difensa entre esses elementos para o css ?
<iframe class="video" src="XPTO...">XPTO...</iframe>
<div class="video">XPTO...</div>
Trecho css.
.video {
width: 560px;
margin: 1em auto;
}
Trecho html.
<section class="beneficios">
<h3 class="titulo-principal">Benefícios</h3>
<ul>
<li class="itens">Atendimento aos Clientes</li>
<li class="itens">Espaço Diferenciado</li>
<li class="itens">Localização</li>
<li class="itens">Profissionais Qualificados</li>
</ul>
<img class="imagembeneficios" src="imagens/beneficiosMod.jpg">
<div class="video"> <!-- class direto ifreme não funciona -->
<iframe width="560" height="315" src="https://www.youtube.com/embed/wcVVXUV0YUY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<iframe src=""></iframe>
<div></div>
</section>