• 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
قرار گرفتن دو دایو بر روی یکدیگر
#1
سلام . من میخوام دو دایو رو روی هم دیگه قرار بدم ... که یکی از دایو ها محتواش یک متغیر هست و دایو دوم دارای تصویر هست که کلاس دایو دوم رو به این صورت تعریف کردم :
کد:
.img-link
{

background-image:url(../image/comment/1347538220_talk_chat.png);
width:55px;
height:45px;
background-size:100%;
}
دایو اول رو هم با خاصیت absulte تنظیم کردم و تا اینجا مشکلی نیست ..
ولی تو مرورگر اکسپلورر background-isize:100% تنظیم نیست .. یعنی ربع تصویر دیده میشه.
شما هم همین راه رو استفاده میکنید ؟ یا راه بهتری هست برای اینکه دو دایو که یکی دارای تصویر و یکی نوشته هست بر روی هم قرار بگیرند.
آرام باش ؛ توكل كن ؛ تفكر كن و سپس آستينها را بالا بزن , آنگاه دستان خداوند را خواهي ديد كه زودتر از تو دست به كار شده است.امام علي عليه السلام.
  پاسخ
تشکر شده توسط :
#2
البته پیشنهاد میدم به جای قرار گیری روش ، دقیقاً توش بنویسAngel
لایک دیس :
کد:
<style>
    .mom
    {
        background : gray url('./img.png');
    }
    
    .child
    {
        background : url(./img-child.png) no-repeat center;
    }
    
</style>

<div class=mom>
    <div class=child>
        some things ...
    </div>
</div>

البته اگه بگی واسه چه کاری میخوای شاید بشه راه حل های بهتری پیدا کرد .
  پاسخ
تشکر شده توسط : pary_daryayi
#3
ممنونم . ولی کدی که دادید نوشته رو روی عکس قرار نمیده یا شاید من درست استفاده نکردم
من میخوام تعداد نظرات کاربران در هر مقاله ای رو توی عکس نشون بدم.
دوتا تصویر زیر رو ببینید . اولی همونطور که میخوام تنظیم شده و در fire fox درسته ولی دومی همون کد رو در IE یک چهارم تصویر نشون میده.


فایل‌های پیوست تصاویر بندانگشتی
       
آرام باش ؛ توكل كن ؛ تفكر كن و سپس آستينها را بالا بزن , آنگاه دستان خداوند را خواهي ديد كه زودتر از تو دست به كار شده است.امام علي عليه السلام.
  پاسخ
تشکر شده توسط :
#4
من واسه این یه div کلی مینویسم . که اون دنباله زیرش بعنوان بک گراوند زیرش باشه .
یه div دیگه توش برای مستطیله .

حالا دیو کلیه رو هر جا خواستم میذارم Big Grin

میخواد کد بنویسم؟
  پاسخ
تشکر شده توسط : pary_daryayi
#5
چرا از z-index تو کلاس هاتون استفاده نکردید؟
هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
  پاسخ
تشکر شده توسط : pary_daryayi
#6
نقل قول:میخواد کد بنویسم؟
نه ممنون. دوست دارم خودم اول امتحان کنم ...
نقل قول:چرا از z-index تو کلاس هاتون استفاده نکردید؟
z-index رو برای ترتیب نمایش دایو ها میگید درسته؟ فکر میکردم برای 2 دایو بیشتر باید استفاده بشه...
آرام باش ؛ توكل كن ؛ تفكر كن و سپس آستينها را بالا بزن , آنگاه دستان خداوند را خواهي ديد كه زودتر از تو دست به كار شده است.امام علي عليه السلام.
  پاسخ
تشکر شده توسط :
#7
به جای استفاده از div از کد های خود html استفاده کنید بهتره در مرورگر های مخطلف هم تقریبا خروجی یک سانی داره
کد:
<fieldset>
  <legend></legend>
</fieldset>
  پاسخ
تشکر شده توسط : pary_daryayi
#8
نقل قول:به جای استفاده از div از کد های خود html استفاده کنید بهتره در مرورگر های مخطلف هم تقریبا خروجی یک سانی داره
ممنونم .. امتحان کردم ولی اون طور که مد نظرم هست نتیجه نداد ... مشکلات قبل رو داره.
من اینطور حلش کردم که بهتره به جای اینکه از div استفاده کنم و بک گراند کلاس رو تصویر تعریف کنم ، خود تصویر رو با تگ img بزارم .. اینطور دیگه background-size=100% نیازی نیست و خود عرض و طول عکس رو میپذیره ... از absoulte هم استفاده کردم و در هر دو مرورگر تنظیم شد ...
آرام باش ؛ توكل كن ؛ تفكر كن و سپس آستينها را بالا بزن , آنگاه دستان خداوند را خواهي ديد كه زودتر از تو دست به كار شده است.امام علي عليه السلام.
  پاسخ
تشکر شده توسط :
#9
نقل قول:z-index رو برای ترتیب نمایش دایو ها میگید درسته؟ فکر میکردم برای 2 دایو بیشتر باید استفاده بشه...
شاید من منظور شما رو درست متوجه نمیشم، ولی اونطور که من میفهمم دقیقاً z-index روی برای این استفاده میکنن که یه لایه رو لایه دیگه باشه:

z-index
هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
  پاسخ
تشکر شده توسط : pary_daryayi
#10
بجای این همه پیچیده کردن کار بهتر نیست اون عکس پس زمینه رو دستی کوچیک کنید!؟
  پاسخ
تشکر شده توسط :


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان