|
לשועלי ה-CSS, לאפשר לDIV-ים צפים שמאלה להשאר באותר שורה + חלוקת המסך ל2
אהלן,
צרפתי קוד לגבי משהו שאמור להיות פשוט, שאני מנסה לעשות ולא כל כך מצליח.
יש לי div ראשי (main) שמכיל div שמאלי וימני - שהמידע בכל אחד הוא דינמי
1. למה לא רואים אותו מאחוריהם? כלומר את הצבע רקע הצהוב
מטרות שלי מהשמאלי (main_left)
2. רוחב - גודל רוחב קבוע וצף שמאלה (לא בעיה)
3. גובה - מקבל את הגובה הגדול מבין שני הדיוים בתוך הראשי (עצמו או הימני) - לא יודע איך עושים
מטרות שלי מהימני (main_right)
4. רוחב - גודל רוחב שחייב לתפוס את שאר המסך עד הסוף (עשיתי 100% או auto וזה לא פותר)
5. מקבל את הגובה הגדול מבין שני הדיוים בתוך הראשי (עצמו או השמאלי) - לא יודע איך עושים
6. בעת צמצום המסך אני רוצה לאסור עליו לקפוץ לשורה הבאה אלא להשאר באותה שורה - ניסיתי כל מיני פתרונות שקראתי ולא הצליח לי....
------------------------לא הצלחתי לצרף את הקובץ אז הנה קוד טסט לעניין הזה-------
קוד PHP:
<html>
<head>
<style>
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
text-align: left;
vertical-align: baseline;
}
#header {
position: relative;
width: 100%;
min-width: 1250px;
height: 100px;
margin: 0px;
padding: 0px;
background: blue;
}
#main_menu {
width: auto;
height: 34px;
min-width: 1250px;
margin: 0;
padding: 0;
background: green;
}
#main{
position: relative;
background: yellow;
width:auto;
height:auto;
border:none;
margin: 0;
padding: 0;
}
#main_left{
float:left;
position:relative;
width:178px;
margin: 0;
padding: 0;
background: red;
}
#main_right{
float:left;
position:relative;
width:auto;
height:auto;
margin: 0;
padding: 5px 0 0 30px;
background: brown;
border:none;
}
#footer {
clear:both;
position:relative;
width: 100%;
min-width: 1250px;
height: 240px;
margin: 0;
padding: 0;
background: pink;
}
</style>
</head>
<body>
<div id="header">
<p>header</p>
</div>
<div id="main_menu">
<p>main_menu</p>
</div>
<div id="main">
<div id="main_left">
<p>main_left</p>
<br> <br> <br>
</div>
<div id="main_right">
<p>main_right</p>
<br> <br> <br> <br> <br> <br>
</div>
</div>
<div id="footer">
<p>footer</p>
</div>
</body>
</html>
|
ראשי
צ'אט
10-05-2012, 11:09
מצב כלאיים
