הוסטס - פורום אחסון האתרים הגדול בישראל

עמוד 1 מתוך 2

הצג 40 הודעות באשכול על דף אחד

הוסטס - פורום אחסון האתרים הגדול בישראל (https://hosts.co.il/forums/index.php)

- פורום תיכנות (https://hosts.co.il/forums/forumdisplay.php?f=14)

- - המרה מtable לdiviים בCSS (https://hosts.co.il/forums/showthread.php?t=93426)

trupix

15-11-11 06:19

המרה מtable לdiviים בCSS

הי,

לפני שאתן את הקוד, אתן תמונה להמחיש מה אני צריך:
http://img856.imageshack.us/img856/2371/jjjugh.jpg

כמו שאתם שמים לב, אני רוצה שרוחבו של החלק האמצעי יהיה 962px, וצד ימין ושמאל שלו יתרחבו עפ"י גודל החלון. כשהגובה של שלושת הטבלאות הללו יהיה 90px

הקוד שלי בtable שאינני מצליח למצוא פתרון תיקני הולם:

PHP קוד:


		
			
<table style="width:100%; height:90px;">

    <tr>

        <td style="background-color:blue;"></td>

        <td style="background-color:green; width: 965px;"></td>

        <td style="background-color:red;"></td>

    </tr>

</table>

תודה לעוזרים

trupix

15-11-11 18:02

מישהו? אני עדיין לא מצליח למצוא פתרון למרות שזה נשמע מאוד פשוט

Itay	15-11-11 19:44

אפשר לעשות את זה עם דיבים, אבל לפעמים אין שום סיבה להשתמש סתם בדיבים כשזה רק מסבך את העניינים יותר
אתה יכול להגדיר display: table-cell ולהגיע למצב דומה או ליצור משהו עם JS שיעדכן את הגודל של התא לפי הרוחב של המסך + מצבים של הקטנת החלון, אבל למה לנסות לחקות טבלה כשאתה יכול להשתמש בה?

בקיצור - טבלה זה לא תמיד רע גם כשמדובר בבסיס של האתר ולא כטבלה אמיתית, צריך לדעת פשוט להבדיל מתי כן להשתמש בה ומתי לא

trupix

15-11-11 20:20

טבלה אכן מפשטת את הדברים במקרה הזה.
אין לי שמץ איך לעשות את זה נכון בDIV. ניסיתי הכל, כולל table cell.

IMNoob

15-11-11 21:04

זה בהכרח חייב להיות טבלה? אולי תגדיר את הצדדים עם span אם מדובר על תמונה?

trupix

15-11-11 22:01

אני לא מצליח ..

http://img856.imageshack.us/img856/2371/jjjugh.jpg

אני שוב מתאר מה אני לא מצליח לעשות.

אני צריך שרוחב החלק הכחול יהיה מוגדר מראש נגיד 950 פיקסלים. והוא ימוקם באמצע.
צד ימין שלו יהיה DIV בצבע X, ושמאל שלו יהיה DIV בצבע Y.

שניהם יקבלו רוחב עפ"י רוחב חלון הדפדפן, והאמצע למעשה נשאר 950 תמיד.

איזה מחרפן זה.
עזרה ? :(

Itay	15-11-11 22:15

מה אתה מנסה להשיג בזה? אם זה רק לצבוע שני צבעים אתה יכול לשים שני דיבים כל אחד ב-50% עם position: absolute עם z-index נמוך, ומעליהם את הדיב של ה-950 עם z-index יותר גבוה

בכל מקרה אני בודק את ה-table-cell רגע

עריכה: זה עובד:

קוד:

<html>

<head>

    <style>

    #d1 { width: 100%; display: table; }

    #i1,#i2,#i3 { display: table-cell; background: red; height: 250px; }

    #i2 { width: 950px; background: blue; }

    </style>

</head>

<body>



<div id="d1">

    <div id="i1">&nbsp;</div>

    <div id="i2">&nbsp;</div>

    <div id="i3">&nbsp;</div>

</div>



</body>

</html>

בכל מקרה כמו שכבר אמרתי - זה מפגר לעשות את זה, אתה יכול לחסוך את השורות של ה-CSS לעשות טבלה בצורה יותר פשוטה

בניה	15-11-11 23:15

מה אתה מנסה לעשות? אולי יש דרך יותר נכונה לעשות את זה?
תעיף מבט כאן:
http://www.upfile4u.net/Files/6j6h3d.html

to_the right
ו
to_the left
מיועדים לתוכן, כשהירוק זה בשביל שזה ימתח לכל רוחב העמוד.

trupix

15-11-11 23:17

אוח, בניה,על פניו - נראה לי עלית על זה.
אמנם המסגרת הצהובה איננה נחוצה, אך אני חושב שזה זה.

אבדוק עוד קצת את הקוד ואגיב לך בעוד כמה דקות

Itay תודה רבה גם לך.

בהערכה רבה..

עריכה:
אוקי זה עדיין לא זה .. החלטתי לעלות פשוט דוגמא (נראה לי הייתי צריך לעשות זאת קודם)

ליחצו כאן

אם תשימו לב, באמצע יש לנו עמודה עם רקע logo.jpg, בצד ימין שלה יש עמודה עם רקע שתואם לצבע הכי ימיני בלוגו, ובצד שמאל יש עמודה עם רקע שתואם לצד הכי שמאלי של הלוגו

עידכון נוסף:
איתי, הקוד שלך היה בדיוק מה שחיפשתי! (שזה מאוד תמוהה, כי ניסיתי את table-cell חח)

תודה רבה חבר'ה.
לילה טוב.

BuildDream

15-11-11 23:38

PHP קוד:


		
			
<div style="height:90px;background: orange;">

    <div style="width:950px;height:90px;position:relative;top:0px;right:50%;margin-right:-475px;background:blue;">

        תוכן של הבלוק המרכזי

    </div>

</div>

כל הזמנים הם GMT +2. הזמן כעת הוא 17:03.

עמוד 1 מתוך 2

הצג 40 הודעות באשכול על דף אחד