ورود

View Full Version : مبتدی: چطور دو عکس را در CSSکنار یکدیگر بگذارم



miladdeveloper
سه شنبه 19 تیر 1397, 13:26 عصر
سلام دوستان چطور میتونم این دو عکس رو کنار هم دیگه بذارم 148522
کد html من به شرح زیر است


<div class="tours"
<div class ="Dubai">
<img src="images/Dubai.jpg" width="160" alt="تور دبی" borfer="4"/>
<p>صبحانه نهار شام تور دبی 3 روز و 4 شب </p>
<p>قیمت<span style="color:#F00">1250000</spam>تومان</p>
</div>

<div class="Istunbul">
<img src="images/IstanbulTour.jpg"width="160" alt="تور دبی" borfer="4"/>
<p>صبحانه نهار شام تور استامبول 3 روز و 4 شب </p>
<p>قیمت<span style="color:#F00">1250000</spam>تومان</p>
</div>
</div>
کد CSS

.tour{
float:left;
}


.Dubai{
direction:rtl;
text-align:right;
float:left;
width:70%;


}


.Istunbul{
direction:rtl;
text-align:right;
float:left;
width:70%;
}

دوستان خیلی مهمه لطفا راهمایی کنید

anvar
جمعه 22 تیر 1397, 18:00 عصر
اگه به قواعد CSS نگاه کنی مشکل و راه حلش مشخص میشه
شما دو تا باکس داری که باید در کنار هم قرار بگیرند پس مجموع عرض آنها نباید از 100 درصد بیشتر شود (در کد شما عرض هر کدام از باکس ها 70 درصد است یعنی مجموع آنها 140 درصد میشود در چنین حالتی یکی از باکس ها بصورت اجباری به قسمت پائین منتقل می شود برای جلوگیری از این وضعیت عرض هر کدام از باکس ها رو 50 درصد بذارید اگر تعداد باکس ها 3 عدد باشند باید عرض هر کدام 33.33 درصد باشن اگر 4 تا باکس باشن عرض هر کدوم 25 درصد و الی آخر)

y_dehghan
دوشنبه 12 شهریور 1397, 17:11 عصر
همانطور که دوستمون گفتند مجموع عرض تصاویر نباید بیشتر از ۱۰۰ درصد باشه اما یه نکته کوچک هست اون هم اینه که اگر شما از padding و border استفاده کنی، این مقادیر هم به عرض تصاویری اضافه میشه و باید اونها رو هم لحاظ کنی یا از box- sizing استفاده کنی که مجموع عرض تصاویری همراه با حاشیه و padding تفاوت نکنه، لینک زیر این موضوع رو کامل توضیح داده:
https://www.datadars.com/css/css-introduction/css_float/