PDA

View Full Version : کار نکردن دستور z-index برای دو div



<?php?>
شنبه 13 تیر 1394, 12:51 عصر
سلام . من میخوام همچین چیزی بسازم :

132874


<body>
<div class="box1"></div>
<div class="box2"></div>
</body>




.box1{
width:700px;
height:100px;
background-color:red;
box-shadow: 0 10px 2px 0 black;
z-index:2;
}
.box2{
width:700px;
height:100px;
background-color:green;
z-index:1;
}



طبق دستور بالا ما دوتا Box داریم - box1 بالای box2 هستش . من به box1 خاصیت box-shadow میدم و براش یک سایه ایجاد میکنم - ولی میخوام سایه رویه box 2 قرار بگیره نه زیرش - سایه ای که با خاصیت box-shadow زدم رفته زیر box2 که من میخوام بیفته روش - برای همین به box1 خاصیت z-index میدم تا بالا تر قرار بگیره اما عمل نمیکنه ؟ چرا ؟

میخوام سایه ای که برای box1 میزنم رویه box2 قرار بگیره نه بره زیرش - چه کنم دوستان ؟ خیلی ممنون

H:Shojaei
شنبه 13 تیر 1394, 16:43 عصر
برای بعضی از خواصیت ها باید position ست کنید دقیقا یادم نیست کدوم بود absolute یا relative ولی یکی از اینها بود که ست کنید اونوقته که z-index کار میکنه...

پیام حیاتی
شنبه 13 تیر 1394, 17:00 عصر
برای استفاده از
z-index باید موقعیت را relative کنید.

m3am3a
شنبه 13 تیر 1394, 17:43 عصر
برای استفاده از
z-index باید موقعیت را relative کنید.

مهم نیس کدوم position باشه فقط نباید static باشه.

<?php?>
شنبه 13 تیر 1394, 23:08 عصر
مهم نیس کدوم position باشه فقط نباید static باشه.


از همه دوستان بابت جوابتون ممنونم

static نباشه ؟ میشه یکم توضیح بدید در این مورد - ممنون

afshinz
یک شنبه 14 تیر 1394, 02:48 صبح
از همه دوستان بابت جوابتون ممنونم

static نباشه ؟ میشه یکم توضیح بدید در این مورد - ممنون
سلام.
position در حالت پیش فرض مقدارش رو static ست شده یعنی هر عنصری که میزارید اگه خودتون بهش position ندید خود به خود position static میگیره. و position که static باشه z-index رو نادیده میگیره. برای همین شما اگه بخواید از z-index استفاده کنید باید یکی از position های دیگه رو به عنصرتون بدید.