Форум программистов, компьютерный форум, киберфорум
Web-дизайн
Войти
Регистрация
Восстановить пароль
 
1 / 1 / 0
Регистрация: 24.01.2013
Сообщений: 12
1

Как закрепить элементы на странице?

13.02.2013, 23:38. Просмотров 946. Ответов 0
Метки нет (Все метки)

В общем есть таблица:
HTML5
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
<ul id="navigation">
 
    <li><a href="#">Element 1</a>
        <ul>
            <li><a href="#">Sub-Element 1</a></li>
            <li><a href="#">Sub-Element 2</a></li>
            <li><a href="#">Sub-Element 3</a></li>
            <li><a href="#">Sub-Element 4</a></li>
            <li><a href="#">Sub-Element 5</a></li>
        </ul>
    </li>
    <li><a href="#">Element 2</a>
        <ul>
            <li><a href="#">Sub-Element 1</a></li>
            <li><a href="#">Sub-Element 2</a></li>
            <li><a href="#">Sub-Element 3</a></li>
            <li><a href="#">Sub-Element 4</a></li>
        </ul>
    </li>
    <li><a href="#">Element 3</a></li>
    <li><a href="#">Element 4</a>
        <ul>
            <li><a href="#">Sub-Element 1</a></li>
            <li><a href="#">Sub-Element 2</a></li>
            
        </ul>    
    </li>
    <li><a href="#">Element 5</a></li>
 
</ul>
и стиль к ней

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
45
46
47
48
49
50
51
52
53
54
@itemWidth: 140px;
@radius: 5px;
 
* {
    margin: 0;
    padding: 0;
}
 
#navigation {
            margin: 30px;
 
 
    li{
        list-style: none;
        float: left;
        width: @itemWidth;
        
        ul {
            display:none;
            li{
               a {
                    background: #ccc;
                    color: #444;
                   
                   &:hover{
                        background: #999;
                        color:#eee;
                   }                
               } 
            }
        }
 
    a {
        text-decoration:none;
        font-size: 14px;
        font-family: arial;
        color: #fff;
        background: #444;
        display: block;
        margin: 3px;
        text-align:center;
        padding: 10px;
        
        &:hover, &.selected {
            background: #ccc;
            color: #444;
        }
        
        -moz-border-radius: @radius;
        webkit-border-radius: @radius;
        border-radius: @radius;
      }
    }
}
и теперь собственно вопрос, как закрепить данные элементы так, чтобы при уменьшение окна они оставались на своих местах, тоесть позиция их была горизонтально в одну строку
Кликните здесь для просмотра всего текста
Как закрепить элементы на странице?
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
13.02.2013, 23:38
Ответы с готовыми решениями:

Как правильно закрепить меню на странице
Скажите пожалуйста, а как правильно закрепить меню что бы оно не болталось при добавлении текста на...

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

Как закрепить элементы на форме?
Доброе время суток! хочу спросить закрепить элементы на форме?Чтобы когда при увеличении и...

Как закрепить элементы чтобы не смещались
Как закрепить элементы чтобы не смещались при уменьшении окна @charset &quot;utf-8&quot;; /* CSS Document...

0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
13.02.2013, 23:38

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

Как закрепить элементы чтобы не смещались???
Вот код: &lt;div style=&quot;position:absolute; right:380; top:18; width:100; height:100&quot;&gt;&lt;a...

Закрепить строку и столбец в таблице на странице
Не знал куда написать, если с разделом ошибся просьба перенести тему! В Excel-е есть возможность...

Как закрепить элементы, чтобы при масштабировании браузера они не слезали?
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;...

Не могу закрепить текстовый слой к странице и уменьшить расстояние между строк
Народ хелп! Работаю в dreamweaver. Сделал второй слой с текстом, который в программе...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
1
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2020, vBulletin Solutions, Inc.