بزرگ کردن a به اندازه ی li

[e_a_23]

یه منو هست که میخوام در حالت hover، اون شکل خاکستری که واسه افکت هاور گذاشتم، به اندازه ی کل li بشه. چیکار کنم؟ در ضمن اون شکلی که واسه hover درست کردم، یه مستطیل با width=152px, height:37px.
116946


<div class="menu">
<ul>
<li class="menuItem firstItem active"><a href="#">هتل کده</a></li>
<li class="menuItem mrgRight"><a href="#">لیست هتل ها</a></li>
<li class="menuItem"><a href="#">عضویت مسافران</a></li>
<li class="menuItem"><a href="#">راهنمای رزرو اتاق</a></li>
<li class="menuItem mrgRight margin"><a href="#">محدوده اعضا</a></li>
<li class="menuItem lastItem"><a href="#">ارتباط با ما</a></li>
</ul>
</div>


.menu
{
width: 980px;
height: 40px;
float: right;
background: url("../Images/gradient3.jpg") repeat-x;
border: solid 1px #fff;
border-radius: 5px;
margin-top: 3px;
}
.menuItem
{
background: url("../Images/spliter1.png") no-repeat left center;
height: 30px;
float: right;
padding: 5px 30px;
}
ul li a
{
font: 14px tahoma;
text-decoration: none;
color: #fff;
float: right;
height: 100%;

padding: 5px 10px;

}
.firstItem
{
margin-right: 10px;
}
.mrgRight
{
margin-right: 10px;
}
.margin
{
margin-right: 10px;
}
ul li a:hover
{
background: url("../Images/hover4.png") no-repeat top center;
border-radius: 8px;
color: #333;

}

[refugee]

برای اینکه تگ های a به اندازه کل تگ li بشه باید از خاصیت : display:block; استفاده کرد .

[e_a_23]

برای اینکه تگ های a به اندازه کل تگ li بشه باید از خاصیت : display:block; استفاده کرد .
کاری که فرمودین انجام دادم ولی هیچ تغییری نکرد.

[e_a_23]

هیچ کس نمی دونه راهش چیه؟

[eidazha]

چه منو زيبايي
خوب شما اول بايد ببينيد واسه hover چه كدي نوشتن ، آيا از عكس استفاده شده ؟ اندازه li ها چند پيكسل هست ؟ سوالتون خيلي كلي هست و با يك عكس گذاشتن نميشه جواب داد ، شما كدهاشو بزاريد تا نسبت به كد تغييرات رو انجام بدم.

[e_a_23]

من که همه چیزو گذاشتم که!!! واقعا قشنگه منو؟

[eidazha]

آره قشنگه
اگه ميشه اون
Images/gradient3.jpg
Images/spliter1.png
Images/hover4.png
رو هم آپلود كنيد ممنون ميشم
كد ها رو ديدم آپلود كنيد تا براتون درست كنم.

[e_a_23]

فقط بار اول که تاپیک رو ایجاد کردم گزینه attach داشتم الان ندارم.
gradient3: width:5px height:40px
hover4: width:152px height:37px
spliter1: width:6px height: 27px

[eidazha]

كنار ارسال پاسخ فوري حالت پيشرفته رو بزن و اتچ كن

[e_a_23]

116983116984116985

[eidazha]

تو قسمت menuitem اينو جايگزين كن
padding: 5px 1px;

[e_a_23]

مرسی بهتر شد ولی یه جور دیگه به هم ریخت. حالا باز روش کار می کنم.

[e_a_23]

درست شد. واقعا ممنونم دوست عزیز.

[tamafi6]

شماکافیه برای تگ a استایل بنویسیدبا عنصر li کاری نداشته باشید
یک نمونه
http://css3.host22.com/files/menuhover

[e_a_23]

آخه هر کاری کردم تگ a سایزش تغییر نمی کرد. با li درست شد.

[eidazha]

خوب وقتي padding داده ديگه كاريش نميشد كرد به غير اينكه padding رو برداشت

[e_a_23]

یه سوال دیگه: چه جوری میشه کاری کرد که هاور روی یکی از آیتم های منو اعمال نشه؟

[eidazha]

يك class واسه اون تعريف كن مثل همون active كه خودت نوشتي بعد بده به اون li كه نميخواي چيزي روش اعمال بشه ، همون active كه نوشتي اون كار رو ميكنه