שלח תשובה

זירת השאלות

766
צפיות
9
תשובות

הוספת פריט לתפריט הנפתח ב CSS

,‏ 14 בינואר, 2007

מצאתי את המאמר בנושא תפריט נפתח בCSS.

נתקלתי בשתי בעיות בעת נסיון להתאים אותו לצרכי.
1. כשהוספתי פריט לתפריט, במסך 1024 ראו שישה פריטים אחד ליד השני, במסך 800 פריט אחד של התפריט נודד לשורה השניה כמו בצילום המסך המצורף. לא הצלחתי להבין מה לשנות בכדי שכל הפריטים יוצגו.
2. אם שומרים על חמישה פריטים, במסך 1024 התפריט לא פרוש מצד לצד אלא מוצמד לימין, גם כאן לא הצלחתי להבין מה לשנות בכדי שכל הפריטים יתפרשו על רוחב המסך.

בתודה מראש

תגיות:

9 תשובות

  1. אלי ענתבי הגיב:
    14 בינואר, 2007 בשעה 7:33 pm

    איך ניסית?
    בא תראה לנו קצת קוד שננסה לעזור…

    ניסית להגדיר רוחב באחוזים? רוחב קבוע?

  2. דאל הגיב:
    14 בינואר, 2007 בשעה 11:20 pm

    קביעת רוחב של 20%
    שיניתי את שני המקומות בהם מדובר על רוחב LI
    ותפריט המשנה השתבש

  3. דאל הגיב:
    14 בינואר, 2007 בשעה 11:21 pm

    הקובץ לא הצטרף

  4. דאל הגיב:
    15 בינואר, 2007 בשעה 9:56 pm

    אולי היום יסכים להצטרף


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
    <html xmlns="http://www.w3.org/1999/xhtml"&gt;
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1255" />
    <title>פיזור שווה באחוזים</title>
    <style type="text/css">
    html, body {
    background:#F4F4EC;
    margin: 0;
    padding: 0;
    direction: rtl;
    text-align: right;
    font: 14px Vardana, Arial, sans-serif;
    behavior: url("https://www.webmaster.org.il/uploadedFiles/Articles/Examples/DDMenu/csshover.htc&quot;);
    }
    div#menu {
    float: right;
    width: 100%;
    border: 1px solid silver;
    background: #DAE8F8;
    }
    div#menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    background: #DAE8F8;
    border: solid silver;
    border-width: 0 1px;}
    div#menu li {
    position: relative;
    margin: 0 -1px 0 0;
    display: block;
    float: right;
    width: 20%;}
    * html div#menu li {
    float: right;}
    div#menu li.submenu {
    background: url("https://www.webmaster.org.il/uploadedFiles/Articles/Examples/DDMenu/submenu_down.gif&quot😉 no-repeat center left;
    }
    div#menu li.submenu li.submenu {
    background: url("https://www.webmaster.org.il/uploadedFiles/Articles/Examples/DDMenu/submenu.gif&quot😉 no-repeat center left;
    }
    div#menu li.submenu li.submenu:hover {
    background-color: #fcc;}
    div#menu li:hover {
    background-color: #fcc;}
    div#menu li a {
    display: block;
    text-decoration: none;
    padding: 0.15em 0.5em 0.15em 0;
    width: 20%;}
    div#menu>ul a {width: auto;}
    div#menu ul ul {
    position: absolute;
    display: none;
    margin-top: -1px;
    width: 9.4em;
    border-top: 1px solid silver;}
    * html div#menu ul ul {
    margin-right: -1px;}
    div#menu ul ul li {
    border-bottom: 1px solid silver;}
    div#menu ul.first li.submenu:hover ul.second,
    div#menu ul.second li.submenu:hover ul.third {
    display: block;}
    div#menu ul.second {top: 1.5em;right: -1px;}
    div#menu ul.third {top: 0;    right: 9.55em;}
    </style>
    </head>
    <body>
    <div id="menu">
    <ul class="first">
    <li><a href="https://webmaster.org.il">דף הבית</a></li>
    <li class="submenu"><a href="#">פורומים</a>
    <ul class="second">
    <li><a href="https://webmaster.org.il">פורום משוב</a></li>
    <li><a href="https://webmaster.org.il">תכנות צד שרת</a></li>
    <li><a href="https://webmaster.org.il">בניית אתרים – צד לקוח</a></li>
    </ul>
    </li>
    <li><a href="https://webmaster.org.il/">לוח מודעות</a></li>
    <li><a href=https://webmaster.org.il>עזרי בנייה</a></li>
    <li class="submenu"><a href="#">מדורים</a>
    <ul class="second">
    <li><a href=https://webmaster.org.il</a></li>
    <li><a href=https://webmaster.org.il</a></li>
    <li class="submenu"><a href=https://webmaster.org.il</a>
    <ul class="third">
    <li><a href="https://webmaster.org.il">מדריך CSS</a></li>
    <li><a href="https://webmaster.org.il">מבחן ידע</a></li>
    <li><a href="https://webmaster.org.il">מאמרים</a></li&gt;
    </ul>
    </li>
    <li><a href="https://webmaster.org.il">מדור כללי</a></li>
    </ul>
    </li>
    </ul>
    </div>
    </body>
    </html>

  5. דאל הגיב:
    17 בינואר, 2007 בשעה 4:54 pm

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

  6. אלי ענתבי הגיב:
    18 בינואר, 2007 בשעה 10:36 am

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

  7. דאל הגיב:
    18 בינואר, 2007 בשעה 7:12 pm

    ניסיתי פעמיים
    פעם כטקסט ופעם כhtm ופעמיים משום מה הקובץ לא עלה

  8. דאל הגיב:
    20 בינואר, 2007 בשעה 4:29 pm

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

    קובץ מקורי:
    http://www.buchach.org/tafrit

    קובץ שבו ניסיתי לפזר את העמודות באופן שווה
    http://www.buchach.org/tafrit/tafrit1.htm

  9. דאל הגיב:
    20 בינואר, 2007 בשעה 4:39 pm

    נסיון הוספת פריט לתפריט
    ניסיתי להגדיר תפריט בן שישה פריטים
    ההסברים בתוך הקובץ המצורף
    http://www.buchach.org/tafrit/tafrit2.htm

שלח תשובה

הכנס כדי לשלוח תשובה