Дата  Запланированые курсы
19.09 Инструментарий управления проектами
23.09 Работа в MS Excel. Расширенные возможности
23.09 Средства векторной графики. Adobe Illustrator
23.09 Компьютерное проектирование в системе AutoCAD (базовый курс)
23.09 Linux-MP. Модульная программа «Архитектура и администрирование Linux»
23.09 Linux-LE. Основы архитектуры и администрирования Linux
23.09 MOC-10985. Введение в базы данных SQL
30.09 CCNA-RS-ITN. CCNA Routing and Switching. Введение в сети
30.09 CCNA-RS-RSE. CCNA Routing and Switching. Основы коммутации и маршрутизации
30.09 CCNA-RS-ConN. CCNA Routing and Switching. Построение распределенных сетей
30.09 CCNA-RS-ScaN. CCNA Routing and Switching. Построение масштабируемых сетей
30.09 I2IOE. Всеобъемлющий Интернет. Введение
30.09 I2CS. Введение в кибербезопасность, версия 2.0
30.09 I2IoT. Введение в Интернет вещей
30.09 MOC-20761. Создание запросов данных при помощи Transact-SQL
30.09 MOC-20697-2. Развертывание и управление Windows 10 с помощью корпоративных служб
30.09 Linux-LF. Расширенное администрирование ОС Linux
30.09 Введение в тестирование программного обеспечения
30.09 Введение в тестирование программного обеспечения
30.09 Введение в тестирование программного обеспечения
01.10 DEV-PY100. Основы процедурного программирования на языке Python
01.10 Основы алгоритмизации и программирования
01.10 DEV-PY-MP+. Расширенная модульная программа "Разработчик прикладного программного обеспечения (язык Python)"
01.10 Архитектура современных компьютеров
01.10 DEV-C-MP+. Расширенная модульная программа «Разработчик прикладного программного обеспечения (Языки С и C++)»
01.10 DEV-J-MP+. Расширенная модульная программа "Разработчик прикладного программного обеспечения (Язык Java)"
01.10 DEV-J110. Java SE. Введение в язык Java
01.10 CCNA-RS-ITN. CCNA Routing and Switching. Введение в сети (ПП+)
01.10 DEV-PY-MP. Модульная программа "Разработчик прикладного программного обеспечения (Язык Python)"
01.10 DEV-J-MP. Модульная программа "Разработчик прикладного программного обеспечения (Язык Java)"
04.10 DEV-C-МP1. Модульная программа «Процедурное программирование. Языки С/C++»
04.10 DEV-C100. Основы процедурного программирования на языках C/C++
07.10 Linux-MP. Модульная программа «Архитектура и администрирование Linux» (ПП+)
07.10 Linux-LE. Основы архитектуры и администрирования Linux (ПП+)
14.10 Трёхмерное моделирование. 3ds Max
14.10 DEV-J-MP. Модульная программа "Разработчик прикладного программного обеспечения (Язык Java)"
14.10 DEV-J-MP+. Расширенная модульная программа "Разработчик прикладного программного обеспечения (Язык Java)"
14.10 MOC-20740B. Установка, Хранение и Вычисления с Windows Server 2016
14.10 MOC-20762. Разработка баз данных SQL
14.10 DEV-J110. Java SE. Введение в язык Java
14.10 Работа в MS Excel. Базовый уровень
18.10 CORTEX-M-MP. Введение в технологии разработки систем управления на базе МК с RISC ядром ARM Cortex-M
18.10 CORTEX-M-INTRO. Введение в современную микроконтроллерную технику
21.10 MOC-20764. Администрирование инфраструктуры баз данных SQL
21.10 MOC-20741. Сетевая инфраструктура на основе Windows Server 2016
21.10 DEV-J120. Java SE. Стандартные пакеты
21.10 CS-EVENT. Обработка событий безопасности сети предприятия
21.10 Профессиональная верстка сайтов. HTML5 и CSS3
21.10 Средства растровой графики. Adobe Photoshop
21.10 Работа в MS Excel. Расширенные возможности
21.10 Adobe After Effects. Создание анимации и эффектов
24.10 Инструменты бизнес-анализа Microsoft Excel: PowerPivot, PowerView
28.10 MOC-20742B. Инфраструктура идентификации на основе Windows Server 2016
28.10 DEV-J130. Java SE. Разработка многоуровневых приложений
28.10 DEV-PYWEB. Разработка WEB приложений на языке Python
29.10 DEV-PY110. Процедурное программирование на языке Python (расширенный курс)
05.11 DEV-J120. Java SE. Стандартные пакеты
05.11 CORTEX-M-RISC. RISC-архитектура ARM Cortex-M в микроконтроллерах
11.11 DEV-SWT110. Введение в технологии разработки программного обеспечения: разработка требований и проектирование
11.11 Компьютерная верстка. Adobe InDesign
11.11 DEV-C110. Процедурное программирование на языках C/C++
18.11 DEV-J200. Java EE. Разработка корпоративных приложений
18.11 MOC-20744. Безопасность инфраструктуры средствами Windows Server 2016
18.11 NET-DLINKSW. Технологии коммутации современных сетей Ethernet
19.11 CORTEX-M-STM32F. Семейство МК компании ST Microelectronics STM32Fxxx с вычислительным ядром ARM Cortex M3
20.11 CCNA-RS-RSE. CCNA Routing and Switching. Основы коммутации и маршрутизации (ПП+)
25.11 DEV-J210. Java EE. Разработка web сервисов
25.11 Поисковая оптимизация (SEO)
03.12 DEV-PY111. Базовые алгоритмы и структуры данных на языке Python
09.12 Поисковая оптимизация (SEO) для профессионалов
09.12 DEV-C200. Объектно-ориентированное программирование на языке С++. Базовый уровень
09.12 DEV-C-МP2. Модульная программа «Объектно-ориентированное программирование. Язык С++»
09.12 DEV-J130. Java SE. Разработка многоуровневых приложений
17.12 CORTEX-M-RTOS. Разработка управляющих программ для МК систем управления с использованием многозадачных ОС реального времени
13.01 DEV-C210. Объектно-ориентированное программирование на языке С++. Углубленное изучение
20.01 DEV-SWT110. Введение в технологии разработки программного обеспечения: разработка требований и проектирование
28.01 DEV-PY200. Объектно-ориентированное программирование на языке Python
30.01 Linux-LF. Расширенное администрирование ОС Linux (ПП+)
17.02 DEV-C220. Прикладное программирование с использованием стандартов С++11, 14, 17, 20. Базовый уровень
25.02 DEV-J200. Java EE. Разработка корпоративных приложений
03.03 DEV-PYWEB. Разработка WEB приложений на языке Python
27.03 DEV-QT10. Прикладное программирование на С++ с использованием Qt. Базовый уровень
30.03 DEV-J210. Java EE. Разработка web сервисов
06.04 DEV-PYQT. Разработка оконных приложений Python c использованием Qt
Добро пожаловать, Гость! Чтобы использовать все возможности Вход или Регистрация.

Уведомление

Icon
Error

скрол браузера сдвигает контент
Akuna
#1 Оставлено : 6 мая 2010 г. 21:27:14(UTC)
Ранг: Новичок

Группы: Зарегистрированные пользователи
Зарегистрирован: 06.05.2010(UTC)
Сообщений: 2
Баллов: 6

Здравствуйте!
Раньше сталкивалась, но как-то не обращала внимание, а тут очень бросается в глаза, получается "дергатня" при переходе с раздела на раздел.
Центрирую контент
<html>
<body>
<table style='margin: 0 auto; width:990px'>
содержимое
</table>
</body>
</html>
Отображается посередине нормально во всех браузерах. Но! как только на странице появляется правый скрол браузера (большой объем текста не влезает на страницу) мое содержимое сдвигается влево на размер скрола.

Подскажите, пожалуйста, как решить задачку. Может JS как-то? но лучше стандартными средствами css/html
Реклама
Mikhail.Buranov
#2 Оставлено : 6 мая 2010 г. 23:08:39(UTC)
Mikhail.Baranov

Ранг: Администратор

Группы: Администраторы, Модераторы, Зарегистрированные пользователи
Зарегистрирован: 07.10.2007(UTC)
Сообщений: 337
Баллов: 2,114,020
Мужчина
Откуда: Russia

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

Особенно, если учесть, что в разных браузерах разная ширина скролл-бара.
Akuna
#3 Оставлено : 7 мая 2010 г. 13:10:36(UTC)
Ранг: Новичок

Группы: Зарегистрированные пользователи
Зарегистрирован: 06.05.2010(UTC)
Сообщений: 2
Баллов: 6

Спасибо за ответ! я раньше об этом тоже как-то не задумывалась..но в этом проекте уж очень видно. Думала, мало ли есть простой выход из ситуации
Mikhail.Buranov
#4 Оставлено : 12 мая 2010 г. 21:28:54(UTC)
Mikhail.Baranov

Ранг: Администратор

Группы: Администраторы, Модераторы, Зарегистрированные пользователи
Зарегистрирован: 07.10.2007(UTC)
Сообщений: 337
Баллов: 2,114,020
Мужчина
Откуда: Russia

Если такое поведение браузера действительно мешает. Например, при динамической подгрузке содержимого, то можно подумать над решением.

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

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
    <title>Пример постоянного скролла</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    <style type="text/css">
        /*
        Убираем поля вокруг контента,
        задаём начальную высоту, что бы задать высоту
        потомков в процентах
        */
        html,
        body {
            margin:0;
            padding:0;
            height:100%;
        }
        /*
        Блок-обёртка будет высотой 100%,
        а нижний отступ заставит его «не поместиться» в экране
        и появится вертикальный скролл
        */
        .wrapper {
            height:100%;
            padding-bottom:1px;
        }
        /*
        Блок с контентом, выровненный по центру
        */
        .content {
            width:990px;
            margin:0 auto;
        }
    </style>
</head>
<body>
    <div class="wrapper">
        <div class="content">
            <p>Содержимое страницы</p>
        </div>
    </div>
</body>
</html>
Mikhail.Buranov
#5 Оставлено : 13 мая 2010 г. 5:19:33(UTC)
Mikhail.Baranov

Ранг: Администратор

Группы: Администраторы, Модераторы, Зарегистрированные пользователи
Зарегистрирован: 07.10.2007(UTC)
Сообщений: 337
Баллов: 2,114,020
Мужчина
Откуда: Russia

А можно и без блока-обёртки:

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
    <title>Пример постоянного скролла</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    <style type="text/css">
        /*
        Убираем поля вокруг контента,
        задаём начальную высоту, что бы задать высоту
        потомков в процентах
Нижний отступ в 1% создаст переполнение области видимости и принудительный скроллбар
        */
        html,
        body {
            margin:0;
            padding:0 0 1px 0;
            height:100%;
        }
        Блок с контентом, выровненный по центру
        */
        .content {
            width:990px;
            margin:0 auto;
        }
    </style>
</head>
<body>
    <div class="content">
        <p>Содержимое страницы</p>
    </div>
</body>
</html>
RSS Лента  Atom Лента
Пользователи, просматривающие эту тему
Guest
Быстрый переход  
Вы не можете создавать новые темы в этом форуме.
Вы не можете отвечать в этом форуме.
Вы не можете удалять Ваши сообщения в этом форуме.
Вы не можете редактировать Ваши сообщения в этом форуме.
Вы не можете создавать опросы в этом форуме.
Вы не можете голосовать в этом форуме.