Как сделать так, чтобы div не становился ниже других div при увеличении

Question

я искал без ответов.Я ЗНАЮ, что я должен сделать что-то вроде

<div class="menu_wrapper">
 <div class="menu_box_item"></div>  <div class="menu_box_item"></div> 
</div>

, когда масштабирование в элементах div отображается друг под другом.я попытался использовать положение: относительный;в оболочке и абсолютная позиция в элементах menu_box

Answer 1

Ваш вопрос не очень понятен, но вы, вероятно, хотите:

div.menu_box_item
{
    display: inline; /* this line is only needed for some old browsers */
    display: inline-block;
}

Кроме того, похоже, что вы создаете список ссылок в верхней части страницы? Для этого вы должны использовать теги <ul> и <li>. Например:

<ul id="nav_menu">
  <li><a href="foo">Foo</a></li>
  <li><a href="bar">Bar</a></li>
</ul>

ul#nav_menu
{
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#nav_menu li
{
  display: inline; /* this line is only needed for some old browsers */
  display: inline-block;
  min-width: 100px; /* minimum width of your nav items */
}

Answer 2

Div отображаются друг под другом, потому что они являются блочными элементами. Если вы хотите, чтобы они были рядом, измените класс следующим образом:

.menu_box_item {float: left; ширина: 50%;}

Вы также можете попробовать добавить это под ваши классы предметов

<div style="clear:both"></div>