کار نکردن دستور z-index برای دو div

**<?php?>** · July 4th, 2015, 14:09

سلام . من میخوام همچین چیزی بسازم :

کد HTML:

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

کد HTML:

    .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 قرار بگیره نه بره زیرش - چه کنم دوستان ؟ خیلی ممنون

**PersianSkyTeam** · July 4th, 2015, 14:12

سلام

خط زیر رو تو .box 2 اضافه کن :

کد:

box-shadow: 0 10px 2px 0 black;

یا کد رو به این شکل بزار :

کد:

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

**<?php?>** · July 4th, 2015, 14:22

نوشته اصلی توسط PersianSkyTeam

سلام

خط زیر رو تو .box 2 اضافه کن :

کد:

box-shadow: 0 10px 2px 0 black;

یا کد رو به این شکل بزار :

کد:

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

ممنونولی جواب نمیده اینم . با دادن خاصیت box-shadow به box2 بد جور در میاد . به این عکس نگاه کنید متوجه منظورم قشنگ میشید :

**PersianSkyTeam** · July 4th, 2015, 14:49

این کد رو تست کن :

کد:

<button id="AdvancedButton1" type="submit" name="box1" value="" style="position:absolute;left:97px;top:218px;width:311px;height:70px;z-index:0;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box1</span></div></button>
<button id="AdvancedButton2" type="button" name="" value="" style="position:absolute;left:97px;top:288px;width:311px;height:64px;z-index:1;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box2</span></div></button>

</body>

**<?php?>** · July 4th, 2015, 14:53

نوشته اصلی توسط PersianSkyTeam

این کد رو تست کن :

کد:

<button id="AdvancedButton1" type="submit" name="box1" value="" style="position:absolute;left:97px;top:218px;width:311px;height:70px;z-index:0;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box1</span></div></button>
<button id="AdvancedButton2" type="button" name="" value="" style="position:absolute;left:97px;top:288px;width:311px;height:64px;z-index:1;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">box2</span></div></button>

</body>

نشد بازم .

**PersianSkyTeam** · July 4th, 2015, 15:20

اینو تست کنید :

کد:

#box1
{
   color: #000000;
   font-family: Arial;
   font-size: 13px;
   -moz-box-shadow: 0px 0px 13px #000000;
   -webkit-box-shadow: 0px 0px 13px #000000;
   box-shadow: 0px 0px 13px #000000;
}
#box2
{
   color: #000000;
   font-family: Arial;
   font-size: 13px;
}

کد :

کد:

<input type="submit" id="box1" name="" value="box1" style="position:absolute;left:109px;top:179px;width:213px;height:51px;z-index:1;">
<input type="submit" id="box2" name="" value="box2" style="position:absolute;left:109px;top:230px;width:213px;height:51px;z-index:2;">

**<?php?>** · July 4th, 2015, 15:37

بازم نشده - من با تگ های input کاری ندارم - من میخوام از تگ های div استفاده کنم .

**PersianSkyTeam** · July 4th, 2015, 15:42

دوست عزیز css دکمه ها رو به این شکل بزار :

کد:

.box1
{
   color: #000000;
   font-family: Arial;
   font-size: 13px;
   -moz-box-shadow: 0px 0px 13px #000000;
   -webkit-box-shadow: 0px 0px 13px #000000;
   box-shadow: 0px 0px 13px #000000;
}
.box2
{
   color: #000000;
   font-family: Arial;
   font-size: 13px;
}

از هر کدی هم که خواستی استفاده کن.این Css اون چیزی هست که لازم دارید.

**<?php?>** · July 4th, 2015, 16:05

بازم اون چیزی که میخواستم نشد و هنوز سایه میره زیر . ازتون ممنونم که مدام کمکم میکنید . تشکر

**PersianSkyTeam** · July 4th, 2015, 16:10

خواهش میکنم.

نگاه کنید این مشکل واسه کد ها هست :

کد:

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

باید اینو دستکاری کنید تا درست بشه.

موضوع: کار نکردن دستور z-index برای دو div

ابزارهای موضوع

نحوه نمایش موضوع

کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

تعداد تشکر ها از PersianSkyTeam به دلیل پست مفید

پاسخ : کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

تعداد تشکر ها از PersianSkyTeam به دلیل پست مفید

پاسخ : کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

تعداد تشکر ها از PersianSkyTeam به دلیل پست مفید

پاسخ : کار نکردن دستور z-index برای دو div

پاسخ : کار نکردن دستور z-index برای دو div

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

موضوعات مشابه

اسکریپت فروشگاه ساز جهان استور ( ورژن جدید فروشگاه ساز کارت استور = ورژن های کارت استور ب صورت رایگان در تاپیک )

مشکل در نمایش صفحه index

مشکل در index

پاک شدن index

جلو گیری از ران شدن index.html ؛ index.htm

مجوز های ارسال و ویرایش