بروز خطا
[message]
اشتراک در سوال
رای ها
[dataList]
Solved مشکل html و css در بخش note ( لیست flex )
0
0
سلام دوستان
من سعی کردم پروژه استاد رو هم تست کنم ، اما ظاهرا کد های استاد برای 03-02-notes.zip شامل کدها تمایش entery-todo ها نمیشه
چیزیکه بهش به مشکل بر خوردم این هست که سمت راست تمام لیست ها یک فضای خالی میوفته ! حتی وقتی که تمام کدهارو شبیه به استاد میزنم !
این فضای خالی سمت راست فقط خاصیت background و border رو بخودش میگیره و چیزهای دیگه رو نمیگیره !
این فضای خالی بصورت پیشفرض در UL وجود داره < ولی چرا برای استاد نمایش داده نمیشد ؟ !
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style2.css">
</head>
<body>
<ul class="todo-entry">
<li>عنوان</li>
<li>توضیحات</li>
<li>تاریخ</li>
</ul>
</body>
</html>
.todo-entry{
max-width: 800px;
display: flex;
justify-content: space-between;
margin: 0 auto;
}
.todo-entry li {
display: inline-block;
padding: 7px 10px;
border-right: 1px solid #888;
border-left: 1px solid #888;
}
.todo-entry:nth-child(odd){
background: rgba(255, 127, 0, 0.5);
}
.todo-entry:nth-child(even){
background: rgba(0, 65, 125, 0.5);
}
+1
0
به کلاس todo-entry یعنی در واقع ul، این خاصیت رو اضافه کن: padding=0 ، چون این حاشیه اضافی فاصله ul با body هست که با padding=0 برای کلاس list این حاشیه از بین میره. همین مشکل رو یکی از دوستان در این لینک داشتن. احتمالا مشکل از همین یه خاصیت padding باشه. (10 سال پیش)
برای این سوال 1 پاسخ وجود دارد.
پاسخگویی و مشاهده پاسخ های این سوال تنها برای اعضای ویژه سایت امکان پذیر است .
چنانچه تمایل دارید به همه بخش ها دسترسی داشته باشید میتوانید از این بخش لایسنس این آموزش را خریداری نمایید .
