2.4 KiB
2.4 KiB
id | title | challengeType | videoUrl | localeTitle |
---|---|---|---|---|
587d78a3367417b2b2512ace | Push Elements Left or Right with the float Property | 0 | دفع عناصر اليسار أو اليمين مع الخاصية العائمة |
Description
position
، ولكن يحدد float
الملكية عنصر. تتم إزالة العناصر العائمة من التدفق العادي للمستند ودفعها إما إلى left
أو right
من عنصرها الأصلي المحتوي على العناصر. يتم استخدامه بشكل شائع مع خاصية width
لتحديد مقدار المساحة الأفقية التي يتطلبها العنصر المضمن. Instructions
section
و aside
عناصر بجانب بعضها البعض. امنح العنصر #left
float
من left
#right
float
على right
. Tests
tests:
- text: يجب أن يحتوي العنصر ذو المعرف <code>left</code> على قيمة <code>float</code> <code>left</code> .
testString: 'assert($("#left").css("float") == "left", "The element with id <code>left</code> should have a <code>float</code> value of <code>left</code>.");'
- text: يجب أن يكون للعنصر الذي له <code>right</code> معرف قيمة <code>float</code> من <code>right</code> .
testString: 'assert($("#right").css("float") == "right", "The element with id <code>right</code> should have a <code>float</code> value of <code>right</code>.");'
Challenge Seed
<head>
<style>
#left {
width: 50%;
}
#right {
width: 40%;
}
aside, section {
padding: 2px;
background-color: #ccc;
}
</style>
</head>
<body>
<header>
<h1>Welcome!</h1>
</header>
<section id="left">
<h2>Content</h2>
<p>Good stuff</p>
</section>
<aside id="right">
<h2>Sidebar</h2>
<p>Links</p>
</aside>
</body>
Solution
// solution required