Прикрепить меню к правой стороне

@La_Perla · Регистрация: 22.11.2012

Студворк — интернет-сервис помощи студентам

делаю резиновый сайт (пытаюсь, по крайне мере). так вот. при таком css меню хоть ты тресни, все равно располагается слева. и float right и text-align right не пашут, если их в меню ставить. только если уменьшить как то умно блок меню по ширине(он у меня на сто процентов). тогда работает float right. но тогда при увеличении масштаба сайта бедлам твориться. вот и не знаю что творить.
помогите разобраться.
блок меню у меня должен быть прикреплен всегда к правой стороне

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
#header{         
        display: block;
        position: absolute;
        margin-top: 3.4%; 
        z-index: 9999;  
        min-width: 100%; 
        max-width: 200%;
        font-size: 140%;    
        left: 0;
        top: 0; 
        border: 1px solid red;      
    }   
     
    
    #menu{ 
        display: block;
        position: relative;
        float: right;   
        min-width: 100%;
        max-width: 0%; 
        border: 1px solid blue; 
    }    
    
    #menu li{
        float: left; 
        text-align: right;
        margin-right: 2%;   
        list-style-type: none;
    }
    
    #menu a{
        text-decoration: none;
        -moz-transition: color 0.2s 0.02s ease;
        -o-transition: color 0.2s 0.02s ease;
        -webkit-transition: color 0.2s 0.02s ease; 
        color: #f0ede8;
        font-size: 1.25em;
        font-family: CaviarDreamsRegular;
        font-weight: 500;
        letter-spacing: 2px;     
        padding: 0.2em; 
        border-bottom: 4px solid transparent;
        
    }

HTML5
1
2
3
4
5
6
7
8
9
10
11
<div id="header">
    <div id="menu">
        <ul > 
        <li><a href="index.html" class="transition">один</a></li>
        <li><a href="ser.html" class="transition">два</a></li>
        <li><a href="g.html" class="transition">три</a></li>
        <li><a href="s.html" class="transition">четыре</a></li>
        <li><a href="c.html" class="transition">пять</a></li>
        </ul>
    </div>
</div>

@Fedor92 · 17.07.2015, 15:58

La_Perla, укажите меню ширину... И только потом выравнивайте...

@La_Perla · 17.07.2015, 16:06 **[ТС]**

сейчас понял, что изменил я ширину(уменьшил) меню, и все нормально. с правой стороны йтеперь.
НО!!!! из-за того что у меня позиционирование хидера абсолютное, при загрузке страницы на телефоне, бло как встоет посередине, и когда пальцами уменьшаешь страницу, то блок на том же месте остается, а надо бы чтобы он на место вернулся, к правому боку.
а без абсолютного позиционирования хидера никак(

@Fedor92 · 17.07.2015, 16:09

La_Perla, давайте ссылку на сайт, посмотрим вместе...

@La_Perla · 17.07.2015, 17:00 **[ТС]**

http://lalaland.esy.es/
прямо сайт дать не могу, уж простите, но вот прямая вырезка оттуда

@La_Perla · 17.07.2015, 17:06 **[ТС]**

вот так вот и получается. страницы только загрузилась, а потом уменьшил ее. и блок на месте остался

@Fedor92 · 17.07.2015, 17:10

La_Perla, используйте медиа-запросы(@media) для корректного отображения Вашего меню на ПК и на мобильных устройствах

@La_Perla · 17.07.2015, 17:29 **[ТС]**

чет не фурычит все равно. изменил там просто хотя бы цвет бэкграунда для media handheld и нишиша чего то

@Fedor92 · 17.07.2015, 18:02

@media screen and (max-width:720px) {#menu{width:40%} } - так пробовали?

@La_Perla · 17.07.2015, 19:32 **[ТС]**

все равно все также, как и на картинках предыдущих(((

@Fedor92 · 17.07.2015, 20:12

La_Perla, не получается запросом задайте фикс ширину для меню, например 400px...

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.07.2015, 15:58
	La_Perla, укажите меню ширину... И только потом выравнивайте... 1

@La_Perla 0 / 0 / 1 Регистрация: 22.11.2012 Сообщений: 73
	17.07.2015, 16:06 [ТС]
	сейчас понял, что изменил я ширину(уменьшил) меню, и все нормально. с правой стороны йтеперь. НО!!!! из-за того что у меня позиционирование хидера абсолютное, при загрузке страницы на телефоне, бло как встоет посередине, и когда пальцами уменьшаешь страницу, то блок на том же месте остается, а надо бы чтобы он на место вернулся, к правому боку. а без абсолютного позиционирования хидера никак( 0

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.07.2015, 16:09
	La_Perla, давайте ссылку на сайт, посмотрим вместе... 0

@La_Perla 0 / 0 / 1 Регистрация: 22.11.2012 Сообщений: 73
	17.07.2015, 17:00 [ТС]
	http://lalaland.esy.es/ прямо сайт дать не могу, уж простите, но вот прямая вырезка оттуда 0

@La_Perla 0 / 0 / 1 Регистрация: 22.11.2012 Сообщений: 73
	17.07.2015, 17:06 [ТС]
	вот так вот и получается. страницы только загрузилась, а потом уменьшил ее. и блок на месте остался Миниатюры 0

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.07.2015, 17:10
	La_Perla, используйте медиа-запросы(@media) для корректного отображения Вашего меню на ПК и на мобильных устройствах 0

@La_Perla 0 / 0 / 1 Регистрация: 22.11.2012 Сообщений: 73
	17.07.2015, 17:29 [ТС]
	чет не фурычит все равно. изменил там просто хотя бы цвет бэкграунда для media handheld и нишиша чего то 0

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.07.2015, 18:02
	@media screen and (max-width:720px) {#menu{width:40%} } - так пробовали? 0

@La_Perla 0 / 0 / 1 Регистрация: 22.11.2012 Сообщений: 73
	17.07.2015, 19:32 [ТС]
	все равно все также, как и на картинках предыдущих((( 0

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.07.2015, 20:12
	La_Perla, не получается запросом задайте фикс ширину для меню, например 400px... 0