رفتن به مطلب

مشکل در استایل دهی


پست های پیشنهاد شده

سلام

خسته نباشید.

من هر کاری میکنم

اندازه تگ a در زیر منوها 200px بشه نمیشه.


<div id="menu">

<ul id="menu-top" class="topnav">
<li id="menu-item-35" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-35">
<a href="http://www.kids.inli-qom.ir/">صفحه اصلی</a>
</li>

<li id="menu-item-38" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-38">
<a href="http://www.kids.inli-qom.ir/?page_id=37">همکاران</a>
<ul class="sub-menu">
<li id="menu-item-131" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-131">
<a href="http://gamecenter98.ir/">تست</a></li>
<li id="menu-item-132" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-132">
<a href="http://www.kids.inli-qom.ir">تست ۲</a></li>
<li id="menu-item-133" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-133">
<a href="http://www.kids.inli-qom.ir">تست ۳</a></li>
</ul>
</li>
<li id="menu-item-62" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-62">
<a href="http://www.kids.inli-qom.ir/?cat=7">مقالات</a>
</li>
<li id="menu-item-65" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-65">
<a href="http://www.kids.inli-qom.ir/?cat=8">داستان های انگلیسی</a>
</li>
<li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47">
<a href="http://www.kids.inli-qom.ir/?page_id=46">رزرو و ثبت نام</a>
</li>
<li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50">
<a href="http://www.kids.inli-qom.ir/?page_id=49">درباره ما</a>
</li>
<li id="menu-item-53" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-53">
<a href="http://www.kids.inli-qom.ir/?page_id=52">تماس باما</a>
</li>
<li id="menu-item-89" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-89">
<a href="http://www.kids.inli-qom.ir/?page_id=85">گالری عکس</a>
</li>
<li id="menu-item-120" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-120">
<a href="http://www.kids.inli-qom.ir/?page_id=119">طراحان</a>
</li>
</ul>
</div>

اینم استایل


#menu{
line-height:24px;
list-style:none;
margin:0;
padding:0;
font-family:Tahoma, Geneva, sans-serif;
font-size:12px;
position:relative;
top:198px;
right:90px;
text-align:center;
}
#menu li {
float: right;
display:inline-block;
padding:0;
margin:0px;
}
/*#menu ul li:first-child
{
width:200px;
}*/
#menu li a {
padding:5px 10px;
text-align:center;
text-decoration:none;

}
#menu ul li ul {
position:relative;
top:0px;
right:10px;
width:40px !important;

}
#menu ul li li
{


display:none;
padding: 0;
-webkit-transition: height .25s ease .1s;
-moz-transition: height .25s ease .1s;
-o-transition: height .25s ease .1s;
-ms-transition: height .25s ease .1s;
transition: height .25s ease .1s;

clear:both;
border: 1px solid #353539;
width:200px;
background-color:#9F0;


}
#menu ul li li a{width:200px !important;}
#menu li:hover > ul li {

display:block;
padding: 0;
direction:rtl;
clear:both;
}
#menu ul li li a {

padding: 4px 30px 4px 0;
margin: 0;
border: none;

}

لینک به ارسال

الان 200 هست دیگه

ببینید کد زیر رو من الان 20 کردمش کوچیک شد


#menu ul li li
{

display:none;
padding: 0;
-webkit-transition: height .25s ease .1s;
-moz-transition: height .25s ease .1s;
-o-transition: height .25s ease .1s;
-ms-transition: height .25s ease .1s;
transition: height .25s ease .1s;
clear:both;
border: 1px solid #353539;
width:20px;
background-color:#9F0;

که تو کد شما 200 هستش

(سطر دوم از اخر . width:20px)

ویرایش شده توسط aminvl
لینک به ارسال

ببخشيد ولي فك نكنم براي تگ a از width استفاده كنن !‌ از padding استفاده كنيد !‌

لینک به ارسال

برای تغییرات سایز تگ a این خط سی اس اس رو به استایل تگ a اضافه کنید


display: inline-block;

لینک به ارسال

برای تغییرات سایز تگ a این خط سی اس اس رو به استایل تگ a اضافه کنید


display: inline-block;

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

لینک به ارسال

نوع نمایش المان رو بصورت بلوک برخط تغییر میده که هم خاصیت یک المن بلوک رو داره و هم خاصیت برخطی رو داره

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...