Por qué el div “blogs-news-info-container” se ubica en la fila 2? La indicación es que se ubique en la columna 2 pero no hay nada directo que le diga que se posicione en esa fila. Por qué no se posiciona en la fila 1 de la columna 2?
Carlos Gutierrez [C6]
student•hace 5 años
Tiene que ver en como estan acomodados en el HTML, tienes 3 elementos que es el
titulo
, la
ìmagen
y el
texto
.
En el CSS el
titulo
, la
ìmagen
ocupan la misma columna por lo que en automatico se posicionan en forma vertical y de ahi CSS sabe que el
texto
que esta en la columna 2 debe ir en la fila 2 porque este es el ultimo elemento
Codigo 1 con el elemento
texto
antes que la
ìmagen
<section class="blogs-news-container"><div class="blogs-main-new"><h3>Noticias</h3><div class="blogs-news-info-container"><h2>What is LoremIpsum?</h2><p>LoremIpsum is simply dummy text of the printing and typesetting industry.LoremIpsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.It was popularised in the 1960s with the release ofLetraset sheets containing LoremIpsum passages, and more recently with desktop publishing software like AldusPageMaker including versions ofLoremIpsum.</p><a href=""class="blogs-button">Leer mas</a></div><div class="blogs-news-img-container"><img src="" alt=""></div></div></section>
Codigo 2 con el elemento
texto
despues que la
ìmagen
<section class="blogs-news-container"><div class="blogs-main-new"><h3>Noticias</h3><div class="blogs-news-img-container"><img src="" alt=""></div><div class="blogs-news-info-container"><h2>What is LoremIpsum?</h2><p>LoremIpsum is simply dummy text of the printing and typesetting industry.LoremIpsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.It was popularised in the 1960s with the release ofLetraset sheets containing LoremIpsum passages, and more recently with desktop publishing software like AldusPageMaker including versions ofLoremIpsum.</p><a href=""class="blogs-button">Leer mas</a></div></div></section>
0
Curso de Maquetación en CSS [Empieza Gratis]
Construye un blog personal con CSS, usando Grid y técnicas de maquetación. Aprende a organizar tu proyecto con clases específicas, incluye herramientas como Chrome DevTools para depurar, y haz que tu sitio sea responsive con media queries.
Construye un blog personal con CSS, usando Grid y técnicas de maquetación. Aprende a organizar tu proyecto con clases específicas, incluye herramientas como Chrome DevTools para depurar, y haz que tu sitio sea responsive con media queries.