צהריים טובים.
למה כשאני מגדיר לאלמנט float הוא צף בעמוד ולא מחושב בגובה העמוד?
יש לי קוד שנראה בערך ככה:

קוד:

 
<div style="height:auto;">
 <div style="float:left">
  dynamic code..
 </div>
 <div style="float:left">
  dynamic code..
 </div>
</div>
 

וכל הקוד הדינאמי כביכול לא מוגדר בתוך div הבסיס, והוא יוצא מחוץ אליו..
מישהו יודע איך אפשר לסדר את זה?
ניסיתי כבר להגדיר display:block אבל זה לא עובד.

אתה לא יכול להגדיר לאלמנט לצוף ולדרוש ממנו לא לצוף...
1. הגדרת שהאלמנטים הפנימיים יצופו שמאלה, כך שאם זה מה שקורה, הקוד פועל כשורה.
2. אם ציפה או ללא, האלמנטים הפנימיים יקבלו הגדרות גובה אוטומטית, גך שהגובה שלהם (וגם הרוחב) יושפע רק מהתוכן והאלמנטים מהצדדים (שבתוך אותה "מכולה").

כל זה בהתאם להצהרות בקוד לעיל, כמבון שאם תוספות ושינויים דברי לא יהיו תקפים.
אתה יכול להעלות דף html המציג את בעייתך בתוספת תיאור של איך היית רוצה שהתצוגה תראה וננסה לעזור.

https://2009-uploaded.fresh.co.il/2...1/78929480.html

העלאתי.
משום מה פה בIE זה עובד.
מה שקורה באתר שלי זה מה שקורה בFF.
כל הטקסט שחורג מהגודל המינימלי שהגדרתי, לא משפיע על הdiv שהוא נמצא בו, מה שגורם לזה שהטקסט מופיע ללא רקע.
אני רוצה שהdiv יגדל בהתאם לטקסט שכתוב בו.
אגב, בהתחלה ניסיתי להעמיד את כל הdivים באותה שורה ע"י display:inline, אבל זה לא עבד, אז יישרתי אותם בעזרת float.

תודה רבה על העזרה!

נראה לי שהבנתי מה הייתה הבעיה..
באמת אי אפשר להגדיר width כשעושים display:inline?
מה קורה אם בכל זאת אני רוצה לחלק את רוחב השורה לפי פיקסלים?

עריכה: לא, זה לא סידר את הבעיה.

תיאורטית, ההצהרה

קוד:

clear: both;

עבור האלמנט .base_div אמור לפתור את הבעיה. מעשית, נראה לי שהבאג קיים בכל הדפדפנים והפתרון שאני מכיר [והוא לא כ"כ אלגנטי] הוא ליצור אלמנט בן עם ההצהרה הנ"ל.

דוגמה:

קוד:

<style type="text/css">
.clear {
	clear: both;
	}


#wrapElement {
	}

.subElement {
	float: left;
	}
</style>

<div id="wrapElement">
	<div class="subElement">Content</div>
	<div class="subElement">Content</div>
	<div class="subElement">Content</div>

	<div class="clear"></div>
</div>

תנסה להוסיף clear:both ל-div הכללי.

עריכה:

התבלבלתי, חשבתי שיש לך בעיה אחרת.
אתה צריך שהאלמנט הכללי יצוף גם כן כדי שהאלמנטים הפנימיים יהיו מחושבים מבחינת הגובה.

שים לב מה קורה בקוד הבא:

קוד:

<div class="base_div">
<div style="float: left; background-color:red;">
		<div class="sub_div">test..</div>
		<div class="sub_div">test2..</div>
</div>
</div>

עריכה2:

גם הפיתרון של ישראל נראה טוב, תנסה מה שיתאים.

עריכה3:

הבעיה הזו קצת מעניינת, אם תשים לב גם position:absolute פותר את הבעיה הספציפית של הגובה. (ב-FF3)

טוב אז ככה:
נניח שהתוצאה שאני רוצה היא כזאת:
1 2 3
1 2 3
1 2 3

אז כשאני מוסיף clear:both לפי מה שהצעת דור, מתקבלת תוצאה כזאת:
1 1 1
2 2 2
3 3 3
הוא כאילו שם את כל הdiv הפנימי בשורה אחת..מבין?
בכל אופן, אם בsub_div אני מגדיר float:left במקום display:inline, ומוסיף מתחת div עם clear:both זה יוצא טוב, כמו שישראל הציע.

אז תודה רבה !
עזרתם לי מאוד..

עריכה:
פתרון 1 - זה עובד! מוזר..אבל עובד! למה אם אני מגדיר אלמנט צף בתוך אלמנט צף הוא כן מתחשב בו?
תשים לב שאם מורידים את שני הdivs הפנימיים הdiv עם הרקע האדום לא נכנס..

פתרון 2 - כן..זה עובד מצוין! התשמשתי בזה גם באתר עצמו וזה עובד עשר..

פתרון 3 - נכון..מעניין..