« Поставить закладку » « Сделать стартовой »

« Форумы » « Блоги » « Статьи » « Новости » « Файлы » « Realcoding IRC » « Site map » « Поиск »


Главная Главная
Анонсы Анонсы
Форумы Форумы
Каталог Каталог
Поиск Поиск
Опросы Опросы
Книжный магазин Книжный магазин
Реклама на сайте
Публикации Публикации
Партнеры Партнеры
Карта Карта сайта
Рассылки Рассылки
RSS экспорт
Настройки Настройки
О нас пишут О нас пишут
Контакты Контакты
Гостевая книга Гостевая книга







    Популярное
Отправка и обработка ответов http-запросов с помощью JavaScript (использование объекта XMLHttpRequest)

Организация памяти в защищенном режиме работы процессора

Функция date() - вывод даты и времени в PHP

Функция AccessResource

Java: Средства построения отчётов для Java-приложений

Кэширование ваших страниц в 5 шагов

Редиректор

ОСНОВЫ ВЕБМАСТЕРИНГА для увлеченных программированием

Оператор EXISTS

Ajax Формы


ПнВтСрЧтПтСбВс
  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      
    Архив файлов

    Сообщества

    Документация

    Кто на сайте
Вы не зарегистрированы.
Имя:

Пароль:

Запомнить

Регистрация позволит Вам пользоваться дополнительными сервисами.
Сейчас на сайте:
Гостей: 99
Пользователей: 0

Статьи:: Интернет технологии :: CSS :: CSS: Внешние и внутренние отступы блоков, разночтение


отправить ссылку другу версия для печати  Обсудить на форуме

CSS: Внешние и внутренние отступы блоков, разночтение



PADDING-BOTTOM: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
PADDING-TOP: 0px;

Это описание внутренних отступов блока — то расстояние, которое будет между рамкой блока и содержимым. Почти так мы писали и в BODY, чтоб начать страницу от края экрана.

margin-bottom: 5px; margin-left: 5px;
margin-right: 5px; margin-top: 5px;



Это описание внешних отступов блока — все это сильно похоже на CELLPADDING и CELLSPACING в описании таблицы.

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

Стенографическое описание
margin: 12px 12px 12px 12px; описывает верхний, правый, нижний, левый внешние отступы.
margin: 12px 12px 12px; описывает верхний, левый и правый, нижний отступы.
margin: 12px 12px; описывает верхний и нижний и правый и левый отступы.
margin: 12px; все внешние отступы по 12px.
Точно так-же записываются и внутренние отступы.

Теперь о "разнице восприятия". Предположим, мы задали ширину блока в 300 пикселей, вставили в блок "кучку" текста, смотрим итог— ага, все хорошо, вот только текст вплотную примыкает к рамке нашего блока. Надо исправить. Делаем это просто— в описании блока добавляем: padding: 50px; Открываем Эксплорер, смотрим— все нам нравится, все путем. Теперь открываем Опера5 или Нетскейп6. О-о-о!. Что-то "разнесло" наш блок! Такой молодой, а такой толстый... С чего бы это...

Если вы проделаете все так, как описано мной, поставте на страничку выше блока таблицу шириной в те-же 300 пикселей. Поставили? Все поняли? Если нет— поясняю. Эксплорер взял наш блок, вогнал в него по 50 пиксел отступов с каждой стороны, при этом ужав ширину текстовой области до 200 и, довольный, на этом успокоился.

Что-же сделали Опера с Нетскейпом? Они оставили без изменения ширину текстового поля и прибавили с каждой стороны по 50 пиксел, в результате весь наш блок "прибавил" в ширине лишнюю сотню. Самое интересное, что они в этом правы! Именно так и надо поступать в соответствии с принятыми стандартами. Это тот случай, в котором Эксплорер "облажался". Говорят, новый шестой Эксплорер так-же "лажается".

Нас, правда, не должно это беспокоить, у нас своих проблем хватает. Что делать? Есть два варианта. Первый— обойти ошибку, второй— исправить ее своими силами.

На этом сайте я просто "в гору не пошел". А зачем? Если мы не можем свободно использовать внутренний отступ самой "коробки", то мы можем применить внешний отступ к содержимому. Прописываем margin: 50px; для параграфа текста, который будет в нашей ячейке и убираем padding: 50px; из описания блока. Все работает.

Для справки. Ширина всего контейнера равна: левый внешний отступ + ширина левой рамки + ширина левого внутреннего отступа + ширина содержимого + ширина правого внутреннего отступа + ширина правой рамки + ширина правого внешнего отступа. О методах "силового" выхода из данной ситуации поговорим в будущем.

Автор: Алямкин Илья Юрьевич
Источник: mtk.on.ufanet.ru




Рубрика: CSS



О том как разработчики пьют кофе.

Юмор

Сегодня ночью вернулся из Москвы, где я посетил сразу три конференции — SQA, PM Days и PHPconf. На конференции прозвучала масса интересных докладов, о которых наверняка еще не раз напишут, я же хочу поделиться некоторыми забавными наблюдениями. В перерывах между докладами все присутствующие могли выйти в холл, где их ожидали вкусные плюшки, молоко, чай и кофе. Для последнего на столах установили пять термосов. Разумеется для более чем двухсот участников конференции их было явно недостаточно и на каждой конференции эту проблему решали по своему, как умели.


Подробнее... | Рубрика: Юмор | Добавлено: 24.06.2008

Работаем с LINQ to XML.

LINQ

Что же, попробуем раскрыть принципы работы этой новой технологии от Microsoft.


Подробнее... | Рубрика: LINQ | Добавлено: 24.06.2008

XmlSerializer - Assembly Leak без спроса.

Сборки и развертывание

В некоторых частях .NET Framework, таких как XmlSerializer, используется внутреннее динамическое создание кода.XmlSerializer создает временные файлы C#, компилирует результирующие файлы во временную сборку и затем загружает эту сборку в процесс. Такое создание кода тоже стоит сравнительно дорого, поэтому XmlSerializer размещает временные сборки в кэш, по одной на каждый тип. Это значит, что в следующий раз при создании кода XmlSerializer для класса Х не будет создаваться новая сборка, а будет использована сборка из кэша. Однако, не все так просто.


Подробнее... | Рубрика: Сборки и развертывание | Добавлено: 24.06.2008

Остальные статьи:

Реализация MVC в WPF. Александр Шер
ADO.NET Sync Services. Марат Бакиров
Рефакторинг JavaScript с применением Microsoft ASP.NET AJAX. Александр Шер
Архитектура приложений: интерфейс пользователя. Дмитрий Мартынов
Введение в Windows Workflow Foundation. Марат Бакиров
Создание расширяемых и удобных библиотек на платформе .NET. Особенности реализац...
Почему Ruby и Python не могут занять место стареющей Java
Использование пространств имен для организации JavaScript-кода
Создание сложных приложений в ExtJS
Google добавил интерфейс для AJAX-библиотек
Стивен Синофски о Windows 7
Несколько вещей об Ajax, которые должен знать веб-мастер
Model-View-Controller для JavaScript
Remix 2008: интернет меняет Microsoft
Планировщик задач на JavaScript
Построение систем автоматического протоколирования Си/Си++ кода

Цитата дня (все,добавить):

    Рубрикатор

Программирование

C/С++
Обучение
Windows API
XAML
Моделирование
Паттерны
Visual Basic 7 .NET
WxWidgets
Функции WinApi
Функции С++
Разработка под Mac OS
Eiffel
Visual Studio 2008
UI дизайн
Алгоритмы
Конкурсные статьи
Turbo Pascal
Visual Studio
CASE-средства
Visual Studio 2005
Без VCL
Delphi
Тех. документация
Тестирование
Software Testing
ООП
TCP/IP
Google Android
Windows Installer
.NET Framework
Драйвера
C# C Sharp
Справка
Проектирование
Информ. системы
Visual Basic
Assembler
Оптимизация кода
Gtk+
Компоненты
Реинжиниринг
Управление проектами
Extreeme programming
Lotus Notes
Алгебраическое проектирование

Интернет технологии

PHP
Perl
ASP
WAP
Cookies
SSI
CGI
Web Servers
VB Script
DNS
CSS
XML
Html
Java Script
Java2ME
Firewall
Flash
.htaccess
Apache
VRML
Протоколы
Поисковые системы
Технология JAVA
Учебник по PHP
Учебник по JavaScript
Учебник по XML
Java Q&A
AJAX
DHTML
XHTML
Dreamweaver
Web 2.0
Python
Вебмастеру
Cisco
Ruby on Rails
Silverlight

Базы данных

Access
InterBase
MySQL
Oracle
ADO .NET
Основы SQL
Учебник по Access 2002
MS
Microsoft FoxPro
Доступ к данным
XML в MS SQL Server 2000
ODBC и MyODBC
Обучение
Caché
DB2
PostgresSQL
Sybase
Теория
Хранилища данных
Безопасность
Реляционные данные
MySQL и mSQL

Остальное:

Разное
Обзоры книг
Безопасность
Графика и дизайн
Юмор
Linux
Фракталы
Microsoft Axapta
Многоядерность
Сети
Microsoft Office
Работа
MS-DOS
Криптография
Графика и игроделание
Новости SDK
Системы защиты
Учебник по AutoCad
CVS
Windows XP
Windows Server 2003
Windows Vista
Windows 7
Мероприятия