[Skip Header and Navigation] [Jump to Main Content]
בית
דרופל ישראל
הבית של קהילת מפתחי ומשתמשי דרופל בישראל

Primary Links

  • בית
  • דרופל בעברית
  • חדש באתר
  • מדריכים
  • תמיכה
  • לוח דרושים
  • נותני שירות בדרופל
  • אתרי דרופל ישראליים
  • שאלות נפוצות
  • ארועים והדרכות
בית » פורומים » ישן » עיצוב אתרים \ ממשק UI

אתגר קטן בCSS

bugCreator, ש', 08/05/2010 - 00:15

שלום לכולם

אני בונה אתר באמצעות drupal ועובד על הCSS לתפריט הראשי.
כל אוביקט בתפריט הוא חלק מרשימה

  • ותוכו לינק.
    אני צריך שלכל אוביקט יהיה רקע ריבועי וטקס משתנה במרכזו.
    התפריט הוא רוחבי - אוביקט אחרי אוביקט,
    הסטייל עבור li הוא:
    display:inline-block;
    background-image:url('images/buttons/link.jpg')
    width: 86px;
    height: 86px
  • בתוך הריבוע הזה אני מנסה למקם את הלינק במרכז, לא רק אנכית אלא גם אופקית.
    ישנם לינקים עם שבירת שורה שהורסים הכל. אני לא יכול להשתמש בmargin מלמעלה ובpostion כי אז המרכז שלהם לא יהיה מיושר עם הלינקים בעלי שורה אחת.
    כמו כן הם גורמים לשינוי בגודל של הבלוק של הli.

    האם למישהו יש רעיונות כיצד למקם את הלינק במרכז?

    ‹ טריקים חביבים ב-css כנראה אחד המודולים המגניבים ›
    • חברי האתר יכולים לשלוח תגובה - כניסה , הצטרפות.
    תגים:
    • עיצוב אתרים \ ממשק UI
    • פיתוח עיצובים
    • CSS
    התמונה של tsi

    אני צריך לראות כדי להיות בטוח

    נכתב ע"י tsi ביום ש', 08/05/2010 - 02:06.

    אני צריך לראות כדי להיות בטוח שהבנתי, אתה יכול לנסות :

    display:table-cell;
    vertical-align:middle;

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

    צחי שלידור, לינוויט
    תשתיות תוכן קהילתיות
    Sasson - Smart Drupal Theming

    • חברי האתר יכולים לשלוח תגובה - כניסה , הצטרפות.
    התמונה של bugCreator

    נראה לי שזה לא נתמך בIE כנראה

    נכתב ע"י bugCreator ביום ש', 08/05/2010 - 19:31.

    נראה לי שזה לא נתמך בIE

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

    http://blog.themeforest.net/tutorials/vertical-centering-with-css/

    http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

    אני לא הצלחתי להגיע לתצואה הרצויה.

    • חברי האתר יכולים לשלוח תגובה - כניסה , הצטרפות.
    התמונה של tsi

    אני לא הצלחתי להגיע לתצואה

    נכתב ע"י tsi ביום א', 09/05/2010 - 01:17.

    אני לא הצלחתי להגיע לתצואה הרצויה.

    אל תתייאש, עוד אפשרות היא לתת class מיוחד ללינקים מרובי השורות באמצעות menu_attributes.module וכך תוכל לתת להם עיצוב נפרד.

    צחי שלידור, לינוויט
    תשתיות תוכן קהילתיות
    Sasson - Smart Drupal Theming

    • חברי האתר יכולים לשלוח תגובה - כניסה , הצטרפות.
    התמונה של Roei-CPO

    תן לLI גובה ורוחב מדוייקים,

    נכתב ע"י Roei-CPO ביום ב', 10/05/2010 - 09:06.

    תן לLI גובה ורוחב מדוייקים, תתן לו גם Poisition:relative
    ואז תתן למה שבתוכו position:absolute עם Top + left
    וזה תמיד ישב באותו המקום, לגבי השני שורות כמו שאתה מבין כנראה אין שום דרך לתקן את זה שגם זה ישב בדיוק באותו מקום כי זה פשוט יותר שורות
    מה שכן אתה יכול לעשות זה "להחביא" א השורה הנוספת בכך שאתה נותן לשורה עצמה
    height:##px; overflow:hidden;

    לא נראה לי שיש אפשרות אחרת, אם עדיין לא עזרתי.. אולי עדיף שתתן לינק למקום ואני בטוח שזה יהיה קלי קלות :)

    סיפיאו - פיתוח אתרים ומערכות בדרופל
    http://www.cpo.co.il

    • חברי האתר יכולים לשלוח תגובה - כניסה , הצטרפות.

    איפה מתחילים ולאן ממשיכים?

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

    להורדת דרופל בעבריתלשפות וגרסאות אחרות, Drupal.org

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

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

    שלום אורח

    כניסה|הצטרפות

    כעת מחוברים 2 משתמשים מזוהים, ו-6 אורחים:
    oshriza, ami7878

    alechko הוא החבר הכי חדש בקהילה!

    דרופל ישראל בפייסבוק דרופל ישראל בטוויטר דרופל ישראל ב-LinkedIn

    חדש בדיונים בפורום

    • taxonomy vs entity reference |‏ alechko
    • LAPP במקום LAMP |‏ hodspot
    • האם דרופל יכול לבנות אתר כמו י... |‏ hodspot
    • Web programmer |‏ meiravshir
    • server/Client Web Developer |‏ meiravshir
    עוד בפורום

    חדש בבלוגים

    • ecommerce module |‏ avrilev
    • הסרת שיער בלייזר |‏ Alex Borodach
    • ערכת עיצוב חדשה FontFolio... |‏ ישראל
    • Mobile Drupal - סיכום הדרכה |‏ לבבי
    • תרגום אוטומטי של ממשק האתר באת... |‏ לבבי
    עוד בבלוגים

    אירועים והדרכות קרובות

    אין פעילויות להצגה. יאללה, מי מארגן משהו?

    ללוח האירועים המלא

    חדש באתרים ישראלים

    • טבעוני תוספי תזונה |‏ morantivo
    • עוגת הגבינה של ישראל - ישראל ה... |‏ zohar
    • דורמטיק - דלתות אוטומטיות |‏ ענת כהנא
    • הכוורת - אתר מבוסס קומונס |‏ אמנון דפני
    • אוצר היום - ישראל היום |‏ zohar
    עוד אתרים ישראלים
    Powered by Drupal, an open source content management system
    אירוח ופיתוח האתר באדיבות לינווייט - דרופל , אנדרואיד וקוד פתוח
    עיצוב, קסמי css וערכת העיצוב טנדו - תום ביגלאייזן
    שותף לדרך - אמנון לבב - ייעוץ משולב
    דרופל ישראל הינה חלק מרשת הקנטינה
    "כללי המשחק" ותנאי השימוש באתר
    [Jump to Top] [Jump to Main Content]