Трабл с навигационным выравниванием

Question

Трабл с навигационным выравниванием

0

У меня возникли проблемы с попыткой выяснить, как правильно настроить навигацию на сайте. То, что я пытаюсь сделать, - начать навигацию в левой части страницы и остановиться примерно на 100 пикселей с правой стороны основного контейнера содержимого. Навигация будет в нем собственном контейнере без родительских контейнеров (если у кого-то нет решения, которое требует иного). В конце навигации я собираюсь поставить изображение. Конечный результат будет выглядеть примерно так:

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

user2588317 17 март 2014, в 05:30

Источник

Теги:

html

css

1 ответ

Ещё вопросы

LOTUSMS · Answer 1 · 2014-03-17T01-25-00.000Z

0

Если вы собираетесь разместить изображение в конце и хотите отклика, вы можете рассмотреть возможность его обертки в родительском контейнере.

<div class="parent">
     <div class="leftside">
          <div class="topmenu"></div>
         <div class="botmenu"></div>
     </div>
     <div class="right-side">
          <img src="image.png" />
     </div>
</div>

Посмотрите, помогает ли эта скрипка

LOTUSMS 17 март 2014, в 01:25

0

Там нет нижнего меню, хотя. Черная часть - это место, куда будет помещаться содержимое страницы (обычная ширина 1000 пикселей, поле: автоматический вид контейнера), которое будет центрировано на странице. Навигация должна останавливаться на 100 пикселей с правой стороны черного контейнера, но растягиваться до левой стороны экрана
user2588317 17 март 2014, в 04:31
0

Мой ответ остается в силе. удалите ботмену div и сложите его под код, который я вам дал. Я отредактирую это в скрипке
LOTUSMS 17 март 2014, в 04:32
0

Это просто делает навигацию шириной 75% и плавающей влево, которая не всегда правильно выравнивается с контейнером содержимого страницы фиксированной ширины, который находится под ним. Или я что-то упустил?
user2588317 17 март 2014, в 04:42
0

Вот и все. В адаптивных проектах, когда вы хотите отобразить два объекта рядом, вы должны предоставить ему родительский контейнер 100% и разделить объекты на две части, в которых сумма будет равна 100%. Большинство заголовков 25-75. 25 - это логотип, а 75 - навигация. Вы должны плавать их влево, чтобы они совмещались рядом. В противном случае они будут накладываться друг на друга. Вы можете использовать display: inline, но это особенно сложно, если вы собираетесь возиться с навигацией там. Обратитесь к Bootstrap.
LOTUSMS 17 март 2014, в 13:19

Показать ещё 2 комментария