2013-08-06 5 views
0

Я пытаюсь изменить ширину некоторых выпадающих меню, чтобы разместить более длинный текст, и даже когда я изменяю значения ширины в этой таблице стилей, ничего не происходит. Вот область моей таблицы стилей, которую я пытался изменить. Может быть, я должен искать где-то еще?изменение выпадающего меню ширина

/******************************************************************/ 
/* Menu Naviation */ 
/******************************************************************/ 

/** Main Menu *********************************/ 
#tabs { 
position:absolute; 
top:3px; 
margin-left:190px; 
} 

#tabs ul {list-style:none;margin-left:30px;} 

#tabs li {position: relative;list-style:none;} 

#tabs ul li.current_page_item, #tabs ul li:hover {background:url(images/gradient-f.png) repeat-x top;} 

#tabs li.menubreak,#tabs li.menubreak:hover { 
background:url(images/break-c.png) left center repeat-y; 
padding: 0 0 10px 2px; 
margin-left:0; 
margin-top:42px; 
} 

#tabs #dyndropmenu ul,#tabs #dropmenu ul { 
display:none; 
} 

#tabs ul li{ 
float:left; 
position:relative; 
padding: 40px 14px 20px 14px; 
height:37px; 
margin-right:1px; 
} 

#tabs li li{background:none;} 

#tabs a { 
padding:0; 
text-decoration:none; 
cursor: pointer; /* IE 7 bug-fix */ 
color:#5f5f5f; 
display:block; 
background:none; 
line-height: 40px; 
z-index:100; 
position:relative; 

} 


#tabs ul li a:hover{color:#6C6C6C;} 

#tabs ul li.current_page_item ul li a { color:#333;} 
/**/Main Menu *********************************/ 




/** Dropdown Menu *********************************/ 
#tabs #dropmenu, #dyndropmenu {z-index:999;} 

#tabs ul ul { 
position: absolute; 
display: none; 
top: 89px; 
*top:90px; 
left: -3px; 
margin: 0; 
background:#fbfbfb; 
opacity:0.95; 
-moz-border-radius: 0 6px 6px 6px; 
-webkit-border-radius: 6px; 
-webkit-border-top-left-radius: 0; 
border-radius: 0 6px 6px 6px; 
-moz-box-shadow: 0 1px 4px rgba(0,0,0,0.2); 
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.2); 
box-shadow: 0 1px 4px rgba(0,0,0,0.2); 
border:1px solid #dfdfdf; 
width:250px; 
z-index:500; 
} 


#tabs ul ul ul { 
-moz-border-radius: 6px; 
-webkit-border-radius: 6px; 
border-radius:6px; 
} 

#tabs ul li ul { 
height:auto; 
margin: 0; 
padding:0; 
padding-top:2px; 
padding-bottom:2px; 
clear:both; 
} 

#tabs ul li ul li a { 
padding: 0 30px 0 12px; 
white-space:nowrap; 
display:block; 
} 

.menudesc { font-size:0.8em;top:-12px;position:relative;z-index:0;} 

#tabs ul li ul li .menudesc {padding: 0 10px 4px 12px;top:0;} 

#tabs .menudesc {color:#b5b5b5;} 

#tabs ul li ul li a {padding-top:4px;padding-bottom:4px;} 

#tabs ul li ul li { 
padding:2px 0 2px 0; 
margin:0 2px 0 2px; 
background:none; 
width:250px; 
height:auto; 
} 

#tabs ul li ul li a {display:block;} 

#tabs ul li ul a { 
height:auto; 
margin: 0; 
display:block; 
line-height:20px; 
} 

#tabs ul li ul a span, #tabs ul li ul a span span{ margin: 0; padding: 0; height: auto; float: none;} 

#tabs ul ul ul{top:auto;} 

#tabs ul li ul ul {left:250px; top: 6px; *top: 0;} 

#tabs ul li:hover ul ul, #tabs ul li:hover ul ul ul, #tabs ul li:hover ul ul ul ul{display:none;} 
#tabs ul li:hover ul, #tabs ul li li:hover ul, #tabs ul li li li:hover ul, #tabs ul li li li li:hover ul{ display:block;} 
/**/Dropdown Menu *********************************/ 





/** Breadcrumbs *********************************/ 
#sub-tabs ul li a, #sub-tabs ul li {font-size:10px !important;} 

#sub-tabs { 
position:relative; 
width:940px; 
margin:0 auto; 
line-height:20px; 
} 

#sub-tabs ul li { 
list-style:none; 
display:inline; 
line-height:60px; 
padding: 0 5px 0 20px; 
background:url(images/break-b.png) left center no-repeat; 
} 

#sub-tabs ul li.home {background:none;padding-left:0;} 
/**/Breadcrumbs *********************************/ 


/******************************************************************/ 
/* Menu Naviation *END* */ 
/******************************************************************/ 

У кого-нибудь есть идеи? Вы можете просмотреть меню по адресу http://larkinhospital.com/site/. Я хотел бы сделать меню больничных служб более широким, чтобы разместить длинные заголовки в меню.

Спасибо!

+0

Это только я или нет меню с надписью «Услуги для пациентов»? – Halcyon

+0

Я не вижу никаких меню с названием 'Пациентские услуги'. Вы говорите о меню «Пациенты и посетители»? –

+0

Извините, это меню больничных служб. –

ответ

0

Код, который вы отправили, - это то место, где следует изменить ширина. Вы можете найти ширину значения быть изменены в обеих:

#tabs ul ul {} 
#tabs ul li ul li {} 

Если это не работает, проверьте права доступа к файлу на style.css правой темы.

+0

Когда я загружаю эту новую таблицу стилей в wordpress, она говорит, что файл был загружен успешно, поэтому я предполагаю, что у меня есть разрешение на его редактирование. Я меняю значение ширины здесь, но безрезультатно. –

+0

Вы уверены, что это подходящая тема style.css? Это должно быть /site/wp-content/themes/DynamiX/style.css – Thundar

0

Вы отрегулировали

#tabs ul li { padding: 40px, 20px, 20px, 20px } 
+0

Да, я корректировал их, но я не вижу никаких изменений. –

0

нужно просто изменить на этом Css изменения в вашем style.css

пожалуйста найти эту строку и изменить на этой

Add this line in your css -> #tabs ul#dyndropmenu li ul.sub-menu { width:164px; border-radius:0 6px 6px 6px; box-shadow:0 1px 4px rgba(0, 0, 0, 0.2); left:-3px; opacity:0.95; position:absolute; top:89px; z-index:500;} 

    Add this line also in css -> #tabs ul#dyndropmenu li ul.sub-menu li { width:auto;} 

    Remove white-space:nowrap; element in this line -> #tabs ul li ul li a { white-space:nowrap;} 

, если это не работайте, пожалуйста, добавьте! важно для всех элементов.

Дайте мне знать, если у вас возникли проблемы.

Thanks,

Смежные вопросы