Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 09.12.2017, 09:11   #1
DenShpak
Новичок
Джуниор
 
Регистрация: 09.12.2017
Сообщений: 1
Восклицание Помогите CSS

При наведении на .menu li a:hovver который имеет border при наведении шрифт увеличиваю на 1px,но при масштабировании вместе начинает двигаться обводка
Цитата:
HTML
Код:
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href=https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300">
    <link rel="stylesheet" href="style/main.css" type="text/css">
    <meta charset="UTF-8">
    <title>ОТСЧЁТ ДО НГ</title>
</head>
<body>
<div class="header">
    <div class="menu">
        <ul>
            <li><a href="#">ДОМОЙ</a></li>
            <li><a href="#">О СЕРВИСЕ</a></li>
            <li><a href="#">СПОНСОРЫ</a></li>
        </ul>
    </div>
</div>
</body>
</html>
CSS
Цитата:
Код:
body{
    padding: 0;
}
.header{
    display: flex;
    border: 2px solid black;
    justify-content: center;
    width:100%;
    margin: auto;
    font-family:Open Sans Condensed ,Arial,Tahoma sans-serif;
}
.menu{
    width: 600px;
    border: 1px soli red;
    box-sizing: border-box;
}
.menu ul{
     text-align: right;
}
.menu li{
    font-size: 20px;
    display: inline-block;
    text-decoration: none;
    position:relative;
    margin-right: 20px;
    padding: 3px;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
}
.menu li a {
    text-decoration: none;
}
.menu li a:hover{
    font-size:21px;
    transition: 0.5ms;
    padding: 0;
    line-height:21px;
}
САЙТ НА КОТОРОМ МОЖНО ПОСМОТРЕТЬ КАК РАБОТАЕТ.САЙТ ПУСТОЙ ПОЛНОСТЬЮ,ТАК,ЧТО ЭТО НЕ РЕКЛАМАDenShpak
С Ув.Денис Шпак
DenShpak вне форума Ответить с цитированием
Старый 11.12.2017, 14:15   #2
AlNick
Пользователь
 
Регистрация: 15.08.2017
Сообщений: 17
По умолчанию

При увеличении размера шрифта, увеличивается область, которую занимает текст. Поэтому рамка сдвигается
AlNick вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите (к js не подключается css) Alex-2 JavaScript, Ajax 5 02.05.2017 11:27
[CSS]: Пытаюсь сделать Карусель без JS, но не срабатывает нужное css-свойство. Помогите разобраться. MeriPoppins HTML и CSS 2 10.02.2017 22:50
Помогите с CSS rznasa HTML и CSS 1 19.02.2015 12:51
Помогите с позиционированием блоков CSS Андрей79 HTML и CSS 1 10.04.2009 10:05
Помогите по CSS вроде :) Юрий777 HTML и CSS 4 16.05.2008 23:26