+2 امتیاز
قبل در برنامه نویسی توسط (7.2هزار امتیاز)
برچسب گذاری دوباره قبل توسط

با ست کردن align="left" در تگ img تنها در مرور گر IE ، تگ div پدر این تگ دفرم می شود. چگونه می توان این مشکل را مرتفع نمود؟

<img border="0" src="images\Cancel.gif" alt="بستن" onclick="hideSearchPopUp('<%=id%>');" align="left"/>

همانگونه که مشاهده میکنید ارتفاع div افزایش یافته و عکس به پایین چپ منتقل شده است.

2 پاسخ

0 امتیاز
قبل توسط (7.2هزار امتیاز)
 
بهترین پاسخ

مشکل از اینجا بود که قبل از دادن width به div پدر، height به آن اعمال نمی شد، قبلا فقط height را به تنهایی ست کرده بودم.

شاید بتوان این را باگ IE نام برد! چون تنها در این مرورگر این مشکل را داشتم.

 

<div id="banner_div" style="overflow: auto; height: 16px; width: 120px;">
            <strong style=" float:right;">
                جستجو
            </strong>
        <img border="0" src="images\Cancel.gif" alt="بستن" onclick="hideSearchPopUp('to1');" align="left">
        <img border="0" src="images\loading.gif" alt="در حال جستجو" style="display:none;  " align="left" name="loading">
    </div>

 

+2 امتیاز
قبل توسط (170 امتیاز)
ویرایش شده قبل توسط

1- اول باید این نکته رو بگم که Text-align  برای تگ img بی معنی است ، چون  زمانی ازین دستور استفاده میشود که بخواهیم محتوای یک تگ را align کنیم و این در حالیست که محتوای تگ img یک تصویر است.

2- برای اینکار باید از float استفاده کرد. و چون میخواهیم به سمت چپ float  شود ابتدا باید تگ img را بنویسیم  و بعد بقیه محتوای تگ پدر را.

3- برای بهم نریختن محتوای پدر دو راه وجود دارد :

a- استفاده از height برای تگ پدر :---------------------

.parent{height:40px;}
.parent  img {float:left ; width:16px ; height:16px; border: none; }
<div class="parent">
<img src="images\Cancel.gif" alt="بستن" onclick="hideSearchPopUp('<%=id%>');"/>
<div >everythings</div>
</div>

b- استفاده از clearer :----------------------------------

.clearer{clear: both;}
.parent  img {float:left ; width:16px ; height:16px; border: none; }
<div class="parent">
<img src="images\Cancel.gif" alt="بستن" onclick="hideSearchPopUp('<%=id%>');"/>
<div >everythings</div>
<div class="clearer"></div>
</div>
قبل توسط (7.2هزار امتیاز)
align یک اتریبیوت مخصوص img است و معنی متفاوتی از direction و text align دارد.
قبل توسط (7.2هزار امتیاز)
رفتار استایل float:left نیز در این مورد مانند اتریبیوت align است، یعنی باعث دفرم شدن فرم می شود.

سوالات مشابه

+2 امتیاز
2 پاسخ 372 بازدید
0 امتیاز
0 پاسخ 176 بازدید
0 امتیاز
1 پاسخ 1.6هزار بازدید
0 امتیاز
1 پاسخ 91 بازدید
+1 امتیاز
1 پاسخ 226 بازدید
0 امتیاز
0 پاسخ 145 بازدید
0 امتیاز
0 پاسخ 193 بازدید
0 امتیاز
1 پاسخ 519 بازدید
...