Центральный элемент, не зная его ширины - PullRequest
Новая
       19

Центральный элемент, не зная его ширины

1 голос
/ 03 апреля 2012

У меня есть такой элемент меню, как: 

<ul>
  <li><a href="#">Item 1</a></li>
  <li><a href="#">Item 2</a></li>
  <li><a href="#">Item 3</a>
      <ul>
          <li><a href="#">SubItem 1</a></li>
          <li><a href="#">SubItem 2</a></li>
          <li><a href="#">SubItem 3</a></li>
      </ul>
  </li>
  <li><a href="#">Item 4</a></li>
</ul>

Элемент позиционируется абсолютно. Как я могу центрировать его, не зная его ширины (количество родительских элементов может измениться).

С уважением, Дэйв

1 Ответ

0 голосов
/ 03 апреля 2012

I думаю, то, что вам нужно, возможно, если у вас есть родительский элемент для ul: 

<div class="example">
   <ul> 
     <!-- lots of li's -->
   </ul>
 </div>

Затем используйте трюк выравнивания текста старой школы, который использовался для центрирования макетов: 

.example {
   text-align: center;
   }

.example ul {
   text-align: left;
   display: inline-block;
   }

См .: http://jsfiddle.net/chippper/WK5Z4/

...