נושא: האמת והאגדה position:absolute

נשלח בתאריך: 10 December 2006 בשעה 15:27 | IP רשוּם

זאת הדרך היחידה לבנות אתר שאפשר להגדיל את גודל הפונט וכל האתר יגדל בשלמותו
בדיוק כמו שהוא באותן הפרופורציות של גובה ורוחב.
בכל שאר השיטות האלמנטים שבדף מתפרסים על המסך אך ללא שמירת הפרופורציה המקורית והדף יכול להראות שונה מאוד על המסכים השונים.
 אני חושבת שאפשר להשתמש בשיטה הזאת בתבונה תוך שילובה עם שיטות אחרות
 ולהינות מהטוב שבה וממה שיש לה להציע.
 אפשר למשל לעשות חצי אתר אנכי שמאלי עם  position:absolute
וחצי האתר אנכי ימני עם טקסט גולש.
אפשר לעשות דף ראשי ממורכז לאמצע מעוצב כך שאין צורך שהוא יתפרס על המסך
אלא מראש רוצים שהוא יהיה קטן שיהיו בו כפתורים שמובילים לדפים שעשויים אחרת.
ישנם ספרי שירה קטנים מאוד וזה הפורמט שלהם.
מה מונע מאתנו במקרים מסוימים לבנות את האתר כשדף הפתיחה שלו הוא ריבוע קטן
מעוצב ואלגנטי בפינה השמאלית העליונה.
יש כל כך הרבה שימושים שאפשר לעשות ולהנות מהמיקום המוחלט.
הכל לפי הצורך ולפי ההתאמה.
זו עוד אופציה שאפשר להשתמש בה בכיף
ולעשות אתה דברים שאי אפשר לעשות עם אופציות אחרות.
על ידי עיצוב מתאים אפשר לעצב את האתר כך שהוא יראה טוב בכל גדלי המסך
ללא התפרסות על המסך. זו רק שאלה של עיצוב.
 אפשר לעשות שלל דברים מקסימים עם המיקום המוחלט.

עריכה:
יש לי הרבה מה ללמוד עדיין בנושא.
אני לא ספצית בעניין.
תובנה חדשה:
אם ממקמים את הדיווים ללא קונטיינר אז זה לא חשוב הסדר שבו הדיויים
רשומים. כל דיו יופיע במקומו האבסולוטי.
אבל אם מכניסים את הדיווים לקונטיינר ומנסים להזיז אותו, אז הדיווים לא יזוזו אתו
כמו שצריך אם הם לא רשומים זה אחר זה בסדר הנכון.
עריכה:
הקווים מקבלים את הצבע של הקונטיינר...
עריכה:
שושן, זה קצת עשה לי מצב רוח רע שהזכרת את זה בנשימה אחת עם פרונט פייג'
מה שאני עושה עם אבסולוט פוזישין אני עושה עם קוד כל כך קצר. אם הייתי עושה את אותו הדבר עם פרונט פייג' הייתי מקבלת קוד כל כך ארוך. זה לא יכול להיות דומה.
עריכה:
מאה ועשר, אני אשלח לך בהזדמנות בפרטי קוד שמדגים את מה שאמרתי לגבי סדר
כתיבת הדיווים המשמעות של הסדר הזה כשהם נמצאים בתוך הקונטיינר.
האמת היא שחבל על הזמן... יש לי הרבה מה ללמוד ולהפנים. אני לא מבינה את הנושא לעומק. אני כבר אחזור עם תובנות חדשות. אני לא אשלח את הקוד כי חבל על הזמן שלך.
עריכה:
הפעם יש לי גילוי עצום. תובנה חדשה גדולה מאוד. הכיוון של העברית אכן צריך להופיע
למעלה בצורה טיפה מעט שונה ואז הכל בסדר הסרגל מופיע בצד שמאל גם
באקספלורר. לעומת זה אם אני משאירה אותו למטה לפי הטיפ החדש הוא אכן עושה בעיות
עם הרלטיב.... כל העניין קצת מרגש אותי מדי... אני טיפה אצטרך לעכל את זה ולהירגע
כל הגילוי נעשה במקרה לגמרי. אני אקח נשימה עמוקה. אמאלה. ואחזור מאורגנת ואעדכן את כל המסמכים הרלוונטים. עריכה: בדקתי את העניין שאם מורידים את השווה מהכיוון אז הסרגל מופיע מצד ימין. זה משהו שאפשר לראות שמשתמשים בו באתרים אחרים. אין מה לחשוש כנראה.
עריכה:
בינתיים ממה שאני בודקת אני מגלה שההטיפ האחרון שלי עם סרגל הגלילה הוא כנראה
טוב למקרים מסוימים והטיפ העכשווי שלי כנראה טוב למקרה ספציפי מסויים.
כל הנושא הזה בהחלט שווה בדיקה. אני מקווה שאני אצליח לבדוק את זה באופן יסודי
ואגיע למסקנות סופיות ומבוססות.
עריכה:
עוד תובנה חדשה. נדמה לי שכל הנושא של אבסולוט ורלטיב והשילוב בינהם עובד
קצת שונה כשעובדים על אתר בעברית עם יחידת המידה em כך שצריך לקחת בחשבון
כששלומדים מאתרים שמלמדים את הנושא לדוברי אנגלית, שזה אולי קצת שונה בעברית.
עריכה:
עוד תובנה חדשה: לדעת להשתמש עם אבסולוט רלטיב וססטאטיק בצורה משולבת
זאת אומנות מורכבת ממש, יותר מתוחכם בהרבה ממה שאנחנו היינו מצפים. זה כמו להצליח לשחק עם הקוביה ההונגרית. זה מורכב ומעניין ודורש סבלנות ולמידה עמוקה
של הנושא.
עריכה:
לצורך מיקום הדיווים צריך להשתמש לפי הצורך באבסולוט, ברלטיב, בסטאטיק
הערכים שצריך להשתמש בהם למיקום הם 0 ומאה אחוז, למעלה ושמאל.
לצורך המיקום יש לשים את הדיווים דיו בתוך דיו, או דיו ליד דיו.
שילובים שונים של אבסולוט ורלטיב, דיו בתוך דיו ודיו ליד דיו, עם תג סוגר וללא תג סוגר יכולים לאפשר לנו למקם את הדיווים בכל מקום שנרצה, כשהם מתיחסים זה לזה,
ולא נמצאים על הדף במקום אחד מוחלט.
השמות אומנם נשארים אבסולוט ורלטיב אך הם כבר מתנהגים אחרת והמיקום
שלהם הוא כבר אינו מוחלט.
שילוב של טקסט באלמנטים פתוחים נצטרך למקם בתור דיו בתוך דיו אולי כדאי להימנע
מאלמנטים פתוחים כשיש טקסט אני צריכה לבדוק את זה. בינתיים אני לא רואה שיש צורך
לעבוד עם אלמנטים פתוחים אולי זה טוב בעיקר ליצירת דוגמאות אבל לא בתור דיווים שמכילים בתוכם דברים. אני צריכה לבדוק את זה.
עריכה: מעניין סידרתי את כל האלמנטים בשיטה החדשה. אבל אני מגלה בעיה חדשה
מכיוון מפתיע, הכל נראה מאה אחוז... אבל כשלוחצים עם העכבר על המסמך, התצוגה
המקדימה שמתקבלת בצד ימין של המסך (של החלונות) לא נראית בסדר, האלמנטים לא נראים כמו בדף עצמו. מעניין למה... יש לי גם מסמכים קודמים שזה כן נראה בסדר.
מעניין מה המשמעות של התצוגה המקדימה והאם היא נותנת אינדיקציה לתקינות הדף.
אני מכל מקום אנסה לחקור ולבדוק את זה מהיסוד.
איזה יופי גיליתי עוד טיפ קטן וחמוד, התצוגה המקדימה של המסמך עוזרת לראות
אם המסמך תקין, ברגע שזה לא עובד עם דפדפן אקספלורר אז אפשר לראות את הבעיה
ישר בתצוגה המקדימה. עכשיו אני מבינה שהרעיון לעבוד עם פיירפוקס ולהיות בטוחה
שזה יעבוד גם עם אקספלורר הוא לא תמיד נכון, כמו שכבר ידעתי אבל שכחתי,
לכן עכשיו אני אעבוד עם אקספלורר ופיירפוקס משולב ואתחיל עם אקספלורר כי אתו יש לי בעיות.
עריכה:
שמתי לב רק עכשיו כשסידרתי את סרגל הגלילה שיהיה מצד ימין זה גרם לכך ששלושת הכפתורים של סגירת המסמך ומזעור המסמך וצמצום המסמך עוברים לצד שמאל.
שווה בדיקה. מעניין מה קורה באתרים אחרים.http://www.standards.co.il/  בדקתי זה בסדר, ככה צריך להיות.

נשלח בתאריך: 23 January 2007 בשעה 14:24 | IP רשוּם

תקשיבו לי,

לפי דעתי האישית position: absolute יכול לחסוך הרבה עבודה אבל בתור עיצוב של שכבה ומיקום אלמנטים על הדף הייתי משתמש ב-float או בטבלאות.

למה? פשוט זה יותר נתמך ואם כל הכבוד ל-css הקלאסיקה כאן עדיין נצפת ברוב הדפדפנים אותו הדבר.

נשלח בתאריך: 23 January 2007 בשעה 18:10 | IP רשוּם

• באג המרווח הכפול
• באג הגיליוטינה
• באג היעלמות הטקסט
• באג הטקסט הכפול
• באג היעלמות אלמנט האב במעבר על אלמנט הבן
• ועוד רבים וטובים...

נשלח בתאריך: 23 January 2007 בשעה 19:15 | IP רשוּם

תראה אני דווקא לא מסכים איתך.

אני כעיקרון מבחינה של עין ומבחינה לוגית מאוד מוכשר אז לי בניית אתרים בא בקלות.

כעיקרון, אני לא ממש מסכים.

עוד הפעם על איזה גירסה אנו מדברים?

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

לא בכולם אבל הרבה יותר משאר הדברים.

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

(שזה דבר דבילי לגמרי)

position: absolute זה נותן עבודה יותר קלה אבל עוד פעם אם תנסה את ה-אינדקס על מספר דפדפנים ישנים תראה שזה בגרוש לא נותן לך ליצור שכבות.

אני במחשב שלי שומר את כל הדפדפנים שיש ואני מריץ את כל מה שאני עושה על הכל.

ותאמין ממה שראיתי גם במערכות הפעלה אחרות floats זה בחירה מאוד טובה של עיצוב ומיקום וזה מאוד קל את האמת.

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

מה שאני הכי שונא זה IE5. עם כל הכבוד אני משתדל גם לעבוד עליו.

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

אם תוכל בבקשה להגיד לי כיצד אתה ממקם אלמנטים על הדף ובמה אתה משתמש ואם תוכל לתת דוגמא של קוד אני אשמח מאוד.

שלך,

מייק

נשלח בתאריך: 23 January 2007 בשעה 19:17 | IP רשוּם

מתנצל אני לא יכול לערוך.

אני התכוונתי לאינטרנט אקפלורר 5 בגירסה מסויימת

נשלח בתאריך: 24 January 2007 בשעה 14:38 | IP רשוּם

ליובל רז שלום רב,

צפיתי ודפדפתי באתריך ונהנתי מאוד! עיצוב נחמד מאוד להפליא.

אהבתי מאוד.

הראשון אומנם היה צעקני מידי אבל השאר יפים מאוד בעיקר אוקטבה.

סה''כ רואים מדובר במקצוען רציני ומתכנת/מעצב שמתמחה במקצועו.

בנוגע אלי:

כעיקרון אני עובד עם: פיירפוקס, אינטרנט אקפלורר 5, 6 7 , נטסקייפ ועד דפדפני שוליים.

אני כעיקרון אוהב לעבוד עם הכל.

אוהב את הכל ושונא להיות על דבר אחד כל הזמן.

עיצבתי הרבה אתרים לבתי עסק וחברים.

אני מאוד אוהב את זה גם כתחביב וגם כעבודה.

אני אוהב להמציא מעצמי דברים חדשים ב-css שאף אחד לא ראה קודם (כמו אפקט בדל סיגריה, משהו חייתי, או כמו floating navigation שזה גם משהו שאני בקרוב יפרסם בפורום).

אני התרשמתי מהעבודות שלך ואני יראה לך כמה שלי אם תרצה.

אני בונה כבר 6 שנים. המוטו שלי הוא: לשאוף לאהוב את מה שאתה עושה, לשאוף להיות טוב ולנסות להגיע לפיסגה, אחרי ההשקעה והעבודה הרבה אפשר להוסיף את ה-"מאוד", אבל לדעת שתמיד יהיו יותר טובים ממך או לפחות אחד.

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

נשלח בתאריך: 24 January 2007 בשעה 17:03 | IP רשוּם

עוד דבר זה בשבילך אם תצטרך יכול להיות אתה יודע אבל זה קשור לפלואוטינג.

הרבה אנשים שהם עושים אתר שבעצם מחולק לשתי COLS בדרך כלל מה שהם עושים זה שנותנים את התוכנה float: left; לשניהם (יכול להיות כל סוג של בלוק אלמנט אבל בדרך כלל מה שמשתמשים לשכבות זה DIV) ואחרי זה משתמשים ב-margin בכדי ליצור רווח בין שתי הקופסאות. זאתי הטעות שגורמת לכל הבאגים שציינת (בערך מה שאני נתקלתי עד עכשיו). אם אתה מציב באלמנט בצד אחד float: left; בבשני פשוט שם float: right זה פותר לך כמעט את כל הבעיות ומונע ממך כאב ראש מיותר שאחרי זה יעשה לך עוד בעיות.

Normally when people create float-based layouts, they float both columns left, and then create a gutter between the columns using margin or padding. When using this approach, the columns are packed tightly into the available space with no room to breathe. Although this wouldn't be a problem if browsers behaved themselves, buggy browsers can cause tightly packed layouts to break, forcing columns to drop below each other.

This can happen on IE because IE/Win honors the size of an element's content, rather than the size of the element itself. In standards-compliant browsers, if the content of an element gets too large, it will simply flow out of the box. However, on IE/Win, if the content of an element becomes too big, the whole element expands. If this happens in very tightly packed layouts, there is no longer enough room for the elements to sit next to each other, and one of the floats will drop. Other IE bugs, such as the 3-pixel text jog bug and the double-margin float bug (see Chapter 9), can also cause float dropping.

נשלח בתאריך: 24 January 2007 בשעה 21:23 | IP רשוּם

hasLayout?

אתה מתכוון להוספה של מיקרוסופט?

אני כעיקרון אין לי שמץ של מושג מה זה עושה נתקלתי פעם פעמיים ואין לי מושג מה זה.

אני קראתי על זה מאמר.

בכל אופן הבנתי מה שאתה מנסה להסביר.

תגיד יש לי עוד שאלה אליך אולי תוכל לעזור לי.

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

כעיקרון אני משחק ואני לא מוצא דבר חדש.

פעם הצלחתי לעשות לייאוט ועיצוב וסידור אלמנטים על ידי visibility ובעזרת br