بهم ریختن قالب با zoom out

این تاپیک 8 پاسخ و 3 مشارکت کننده دارد . آخرین آپدیت توسط :  نگار فرزام ،‏ 2 سال و 7 ماه پیش .

این تاپیک تاکنون 1501 بازدید داشته است .

نویسنده پست
چهار شنبه ، 27 نوامبر 2013     3:37 ب.ظ #


14morteza14

Subscriber
3 پست3 تاپیک

دوستان لطفا کمک کنید. یه مدته رو مغزم داره راه می ره. برای طراحی این قالب با html , css از تگ های div تو در تو استفاده کردم. اما وقتی زوم منفی به قالب تو مرورگرم می دم بلوک سمت چپ می افته پایین بلوک سمت راست.

کل عرض قالب 960px و بلوک راست 180px و بلوک چپ هم 770px.

 

1  تشکر
چهار شنبه ، 27 نوامبر 2013     4:32 ب.ظ #


امیر

ناظم
840 پست3 تاپیک

سلام :) به انجمن 7لرن خوش اومدید

شما بادی رو به صورت زیر بنویس و امتحانش کن:

2  تشکر
چهار شنبه ، 27 نوامبر 2013     5:02 ب.ظ #


14morteza14

Subscriber
3 پست3 تاپیک

امیر جان خیلی خیلی ممنون درست شد. خیلی لطف کردی و من خیلی برات دعا کردم

فقط یه سوال، تو adobe dreamweaver که دارم باهاش کار می کنم یه همچین کدی رو پیدا نکردم. می شه لطف کنین بگین کارش چیه؟

با سپاس

1  تشکر
چهار شنبه ، 27 نوامبر 2013     6:42 ب.ظ #


امیر

ناظم
840 پست3 تاپیک

خواهش میکنم

شبیه inline هست، اما اون رو یک باکس انعطاف پذیر میکنه که برای ساخت باکس هایی که با اندازه اسکرین های متعدد سازگار باشند، مناسب هست. اما چون با مرورگرای قدیمی سازگار نیست، پیشنهاد نمیشه زیاد استفاده بشه. پیشنهاد من استفاده از درصد به جای پیکسل برای اندازه ها هست تا با کم و زیاد شدن زوم، صفحتون به هم نریزه.

اما با کدهای خودتون هم که در پست اول دادین، مقدار عرض #left رو اگر کمتر کنید، مثلا 750 پیکسل و مقدار float رو هم برابر left قرار بدید، با زوم کردن مشکلی براش ایجاد نمیشه.

سربلند باشید

1  تشکر
چهار شنبه ، 27 نوامبر 2013     7:04 ب.ظ #


14morteza14

Subscriber
3 پست3 تاپیک

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

من کد زیر را برای سازگاریش با اکسپلورر امتحان کردم اما نشد:

0  تشکر
چهار شنبه ، 27 نوامبر 2013     7:08 ب.ظ #


امیر

ناظم
840 پست3 تاپیک

شما اگر قسمت آخر پست قبلیمو انجام بدین .. یعنی کمی مقدار عرض رو کم کنید، این مشکلتون بدون این کد هم حل میشه.

0  تشکر
چهار شنبه ، 27 نوامبر 2013     7:13 ب.ظ #


14morteza14

Subscriber
3 پست3 تاپیک

درسته اما اگه عرض بلوک چپ را از 770 کمتر بگیرم به header نمی رسه و هم باد اون نمی شه!

0  تشکر
چهار شنبه ، 27 نوامبر 2013     10:24 ب.ظ #


امیر

ناظم
840 پست3 تاپیک

عرض کل رو هم میتونید زیاد کنید. مثلا به 980 پیکسل ..

0  تشکر
سه شنبه ، 15 آوریل 2014     10:28 ق.ظ #


نگار فرزام

Subscriber
1 پست0 تاپیک

من هم یه همچین مشکلی دارم میشه بگین چطوری میشه حلش کنم :(

اینم کدش:

<div class="box_holder">
<div class="box_holder_in">
<h4>افزونه آمار بازدید</h4>
<p dir="rtl">این افزونه تعداد بازدیدهای سایت رادر اختیار شما قرار می دهد.این افزونه حرفه ای جوملا شامل یک ماژول و یک پلاگین است و کاملا سازگار با جوملا ۲.۵ می باشد.</p>
<a class="template_readmore2" rel="nofollow" href="index.php?option=com_content&amp;view=article&amp;id=114:jm-visitors&amp;catid=89:articles-articles">مطالب بیشتر</a></div>
</div>
<div class="box_holder second">
<div class="box_holder_in">
<h4>افزونه جی کامنت</h4>
<p dir="rtl">این افزونه حرفه ای جوملا کاملا سازگار با جوملا ۲.۵، جوملا ۱.۷ و جوملا ۱.۶ است و استفاده از آن به دلیل پنل مدیریت کاملا فارسی بسیار ساده است.</p>
<a class="template_readmore2" rel="nofollow" href="index.php?option=com_content&amp;view=article&amp;id=112:jcomments&amp;catid=89:articles-articles">مطالب بیشتر</a></div>
</div>
<div class="box_holder third">
<div class="box_holder_in">
<h4>افزونه کلمات کلیدی</h4>
<p dir="rtl">استفاده از این افزونه حرفه ای بسیار ساده و راحت بود و افزونه تورتگ کامل ترین افزونه کلمات کلیدی سازگار با جوملا 2.5 و جوملا 3 می باشد.</p>
<a class="template_readmore2" rel="nofollow" href="index.php?option=com_content&amp;view=article&amp;id=115:jm-tortags&amp;catid=89:articles-articles">مطالب بیشتر</a></div>
</div>
<div class="box_holder fourth">
<div class="box_holder_in">
<h4>افزونه آب و هوا</h4>
<p dir="rtl">این افزونه حرفه ای جوملا کاملا سازگار با جوملا ۲.۵، جوملا ۳، جوملا ۱.۷ و جوملا ۱.۶ است و استفاده از آن به دلیل پنل مدیریت کاملا فارسی، بسیار ساده است.</p>
<a class="template_readmore2" rel="nofollow" href="index.php?option=com_content&amp;view=article&amp;id=113:jm-weather&amp;catid=89:articles-articles">مطالب بیشتر</a></div>
</div>

 

پیوست ها:
You must be logged in to view attached files.
0  تشکر
پست 1 تا 9 (از مجموع 9 پست)

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