באתר שלי http://www.serieswatch.com יש תפריט עליון המורכב מרשימה של HTML
(ul, li) שצורתו החיצונית מעוצבת ע"י קובץ CSS.
כל כפתור בתפריט מורכב משלושה תמונות, כאשר התמונה השמאלית משום מה אינה מתרחבת לגובה של שאר הכפתור.

כדי שלא אמשיך לנסות להסביר לשווא, כנסו עם IE ועם FFOX ואני בטוח שתראו את ההבדל מיד.
אשמח אם תוכלו לעזור לי לגרום לכך שהתפריט יראה כמו שהיא נראה ב-IE.
קובץ ה-CSS נמצא ב http://www.serieswatch.com/serieswatch.css

שני דברים:
* רק אלמנט מסוג block יכול לקבל הגדרות כגון: width, height, padding ו-margin. שנה את הקישורים (a) ל-block.
* נראה לי יותר יעיל להשתמש ב-float מאשר ב-display:inline על פריטי הרשימה (li).

הנה הקטעים הרלוונטיים ב-CSS:

קוד:

#navlist
{
font-size: 11px;
padding: 0px;
padding-bottom: 5px;
margin-left: 0px;
border-bottom: black 1px solid;
font-family: Verdana,Arial,Helvetica,Geneva,Swiss,Sans-Serif;
}
#navlist li /* each tab */
{
margin: 0px;
background: url("img/left.gif") no-repeat left top;
list-style: none;
display: inline;
}
#navlist li a
{
background: url("img/right.gif") no-repeat right top;
color: White;
padding-left: 3px;
padding-right: 20px;
padding-top: 5px;
padding-bottom: 5px;
margin-left: 10px;
border-bottom: medium none;
}

פיתרון קצת יותר קל ליישום לדעתי יהיה לשנות את הסטייל של #navlist li להיות:

קוד:

#navlist li /* each tab */
{
	padding-bottom: 5px;
	* padding-bottom: 0px;
	padding-top: 5px;
	* padding-top: 0px;
	margin: 0px;
	background: url("img/left.gif") no-repeat left top;
	list-style: none;
	display: inline;
}

עובד באקספלורר ובמוזילה

בברכה, דקל

"מתכנת זה אדם שפותר בעיה שעל קיומה לא ידעת, בדרך שאינך מבין"

מצטער שלא שמתי לב לתגובה פשוט קראתי כבר באינטרנט על מנגון ה sliding doors של css וזה פשוט עבד לי.

Your signature did not follow Fresh's signatures policy, therefore it was automatically erased. Please see the E-Mail which has been sent to you, to learn how to fix this.