קביעת גובה לדיב ע"פ גובה העמוד

הנושא בפורום 'קהילת מפתחי אתרי אינטרנט' פורסם ע"י izavit, ‏25/8/14.

  1. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    ברצוני לקבוע לסיידבר שיתאים את גובהו ע"פ גובה העמוד.

    איזו הגדרה עלי לתת ב CSS?

    תודה.
     
  2. אריה123

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
    אני חושבת שאין כזאת אפשרות.
    האפשרות היחידה להגדיר גובה של דיב היא בפיקסלים.
     
  3. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    תודה,
    ובכל אופן, אשמח לשמוע מישהו שחולק על דעתך...
     
  4. אריה123

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
    גם אני אשמח.
    זה יהיה שימושי גם בשבילי...
     
  5. נפוליאון

    נפוליאון משתמש רשום

    הצטרף:
    ‏10/3/11
    הודעות:
    285
    תודות :
    16
    נקודות:
    19
    קוד:
    div {
    position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
    
    או להגדיר את אלמנט הזה וכל ההורים שלו עם height: 100%
     
  6. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    הגדרתי את ההגדרה הנ"ל והיא גרמה לדיב לצוף מעל כל האלמנטים בדף, הגובה לא השתנה כלל.
    גם כשהגדרתי גובה של 100% לכל הדיוים, לא השתנה הגובה.
     
  7. Shia

    Shia משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏27/5/09
    הודעות:
    5,553
    תודות :
    28
    נקודות:
    149
    כמובן שזה לא עבד. (הקוד שנפוליאון הציע) זה ממש לא נכון.

    צריך להסביר קודם כל מה הבעיה: למה דיב שנותנים לו גובה 100%, לא ממלא את גובה ההורה שלו?
    ובכן, אם גובהו של האלמנט ההורה, הוא תוצאה של התוכן שנמצא בתוכו, או במילים אחרות, לא נקבע לו גובה בצורה מפורשת, אזי לא ניתן לקבוע לאלמנט שבתוכו, גובה 100% - כי הדפדפן לא יודע לפרש את זה למידות - 100% ממה?..

    לעומת זאת, אם האלמנט ההורה הוא בעל גובה מפורש, אזי גם האלמנט בפנימי, יכול לקבל ערך של 100% גובה.
    לדוגמה: http://jsfiddle.net/7shubpx6/

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

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
    אצלי זה עבד...
    מה הכוונה "לצוף"-שזה מכסה את כל האלמנטים האחרים בדף?
     
  9. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    תודה רבה על ההסבר המפורט.
    אני באמת לא מעוניינת לתת גובה מוחלט לדיב ההורה.

    מדובר באתר הזה, אשמח לשמוע על פיתרון יצירתי...

    מיכל,
    אכן, כוונתי שהדיב מכסה את כל האלמנטים בדף.
    מילא אם הגובה היה משתנה, הייתי מתמודדת עם זה, אבל זה לא קרה...
     
  10. אסף טובי

    אסף טובי משתמש רשום פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏21/1/08
    הודעות:
    21
    תודות :
    1
    נקודות:
    14
    בס"ד
    אפשר ב javascript
     
  11. אסף טובי

    אסף טובי משתמש רשום פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏21/1/08
    הודעות:
    21
    תודות :
    1
    נקודות:
    14
    בס"ד
    אם תגדיר את ה body ב 100% אז תוכל להגדיר את הדיב ב 100% ותגיע לתוצאה הרצויה
    כמובן הדיב צריך להיות צאצא שלה body
     
  12. mat

    mat עריכת וידאו

    הצטרף:
    ‏24/4/11
    הודעות:
    1,645
    תודות :
    419
    נקודות:
    94
    תעשו כמו שנפולאיון הציע.
    ותעשו את האב.
    position: relative;

    זה יעשה את ה absolute באופן יחסי לאב.
     
  13. Shlomi

    Shlomi משתמש פעיל פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏20/4/10
    הודעות:
    1,215
    תודות :
    9
    נקודות:
    54
  14. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    תודה לכל מי שניסה לעבור, אבל אני לא מוצאת פיתרון
    אף אחת מהדרכים הנ"ל לא הוכיחה את עצמה.

    האם תוכלו לתת הגדרות מדוייקות, לאיזה דיבים בדיוק לתת את ההגדרות?

    הלינק לאתר הספציפי נמצא כמה בהודעה מס' 9.

    תודה
     
  15. אריה123

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
  16. izavit

    izavit משתמש מקצוען

    הצטרף:
    ‏1/7/08
    הודעות:
    1,654
    תודות :
    10
    נקודות:
    107
    תוכלי בבקשה להעתיק לי את תוכן העמוד? האתר חסום לי.

    תודה
     
  17. אריה123

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
    בקובץ המצורף.
     

    קבצים מצורפים:

  18. Nahum

    Nahum משתמש צעיר פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏11/6/08
    הודעות:
    500
    תודות :
    43
    נקודות:
    39
    תלמדו javascript (בפרט jquery), זה יעשה לכם חיים קלים...

    זה הקוד:
    PHP:
    var pageHeight = $(document).height();
        $(
    '.demo').css('height',pageHeight);
    להחליף את demo בשם של הדיב שלכם (אם זה ID לשנות את ה. ל#), וזה הכל.

    דוגמה לקוד המלא:
    http://jsfiddle.net/dnmf9dnt/
     
  19. אריה123

    אריה123 משתמש מקצוען פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏24/12/08
    הודעות:
    4,636
    תודות :
    97
    נקודות:
    130
    מיקום:
    בני ברק
    דף הבית:
    לא הבנתי, זה javascript או php?
    חוץ מזה, ברור שאפשר לעשות את זה ב-jquery אבל אני חושבת שמה שאפשר עדיף לעשות ב-css.
     
  20. Nahum

    Nahum משתמש צעיר פיתוח / אפיון / עיצוב אתרים

    הצטרף:
    ‏11/6/08
    הודעות:
    500
    תודות :
    43
    נקודות:
    39
    זה javascript, פשוט העורך של פרוג מאפשר או HTML או PHP ...

    יש דברים שעדיף לפתור בCSS, ויש דברים שפשוט יותר קל לפתור בJS. פה ראיתי שכולם מסתבכים עם הCSS אז הצעתי פיתרון פשוט וקל בJS.

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