1.9 KiB
1.9 KiB
id | title | challengeType | videoUrl | localeTitle |
---|---|---|---|---|
587d78ae367417b2b2512aff | Use the order Property to Rearrange Items | 0 | Utilice la propiedad de orden para reorganizar artículos |
Description
order
se utiliza para indicar a CSS el orden en que aparecen los elementos flexibles en el contenedor flexible. De forma predeterminada, los elementos aparecerán en el mismo orden en que vienen en el código fuente HTML. La propiedad toma números como valores y se pueden usar números negativos. Instructions
order
propiedades CSS a #box-1
y #box-2
. Dé a #box-1
un valor de 2 y a #box-2
un valor de 1. Tests
tests:
- text: 'El elemento <code>#box-1</code> debe tener la propiedad de <code>order</code> establecida en un valor de 2.'
testString: 'assert($("#box-1").css("order") == "2", "The <code>#box-1</code> element should have the <code>order</code> property set to a value of 2.");'
- text: 'El elemento <code>#box-2</code> debe tener la propiedad de <code>order</code> establecida en un valor de 1.'
testString: 'assert($("#box-2").css("order") == "1", "The <code>#box-2</code> element should have the <code>order</code> property set to a value of 1.");'
Challenge Seed
<style>
#box-container {
display: flex;
height: 500px;
}
#box-1 {
background-color: dodgerblue;
height: 200px;
width: 200px;
}
#box-2 {
background-color: orangered;
height: 200px;
width: 200px;
}
</style>
<div id="box-container">
<div id="box-1"></div>
<div id="box-2"></div>
</div>
Solution
// solution required