Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> border vs. width:100% 
:(
    Опции темы
NCIAC
Дата 27.1.2011, 04:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 55
Регистрация: 7.2.2009

Репутация: нет
Всего: нет
Здравствуйте.
Помогите решить проблему человеку, который не специалист в CSS. В диве есть другой див. Для внутреннего дива применён стиль:
Код

.style01 {
  padding-left:0px;
  padding-bottom:0px;
  float:right;
  width:100%;
  background:#F8E7BD;
  border:1px #c3b89a solid;
  margin-top:10px;
}

А наружный див имеет фон и получается, что при назначении бордера, этот самый бордер выступает на толщину бордера из внешнего дива. Если border-left и border-right не назначать, то внутренний див как раз вписывается во внешний, а так получается не красиво. Помогите справиться
PM MAIL   Вверх
Addmin
Дата 27.1.2011, 06:22 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 803
Регистрация: 3.2.2006
Где: сослан в Сибирь

Репутация: нет
Всего: 15
Используй вместо border свойство outline:
http://css.manual.ru/properties/outline


--------------------
SimpleFit.ru - блог о том, как заниматься спортом нормальным людям
--
Стимул работы в Сибири - комары.
PM MAIL   Вверх
NCIAC
Дата 27.1.2011, 08:05 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 55
Регистрация: 7.2.2009

Репутация: нет
Всего: нет
Цитата(Addmin @ 27.1.2011,  13:22)
Используй вместо border свойство outline:
http://css.manual.ru/properties/outline

Этот способ не подошёл
PM MAIL   Вверх
SelenIT
Дата 27.1.2011, 08:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401
А разве нельзя width:100%; и float:right; просто убрать?


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
Addmin
Дата 27.1.2011, 08:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 803
Регистрация: 3.2.2006
Где: сослан в Сибирь

Репутация: нет
Всего: 15
Или сделать margin-left: 1px; и margin-right: 1px;


--------------------
SimpleFit.ru - блог о том, как заниматься спортом нормальным людям
--
Стимул работы в Сибири - комары.
PM MAIL   Вверх
NCIAC
Дата 28.1.2011, 03:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 55
Регистрация: 7.2.2009

Репутация: нет
Всего: нет
Цитата(SelenIT @ 27.1.2011,  15:18)
А разве нельзя width:100%; и float:right; просто убрать?

нельзя

Добавлено через 1 минуту и 40 секунд
Цитата(Addmin @ 27.1.2011,  15:42)
Или сделать margin-left: 1px; и margin-right: 1px;

margin-left и margin-right не работают при width:100%;
PM MAIL   Вверх
Addmin
Дата 28.1.2011, 05:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 803
Регистрация: 3.2.2006
Где: сослан в Сибирь

Репутация: нет
Всего: 15
Ну так и сделайте без width: 100%. Это чудесно работает в FF, Chrome. Думаю, Opera и IE тоже не будут капризничать smile

Код

<!DOCTYPE html>
<html>
<head>
    <title>Тестовая страница</title>
    <meta content="text/html" charset="utf-8">
    <style>
        *
        {
            margin: 0px;
            padding: 0px;
        }
        #wrapper
        {
            background-color: #ffa500;
            width: 200px;
            min-height: 500px;
            margin-left: 50px;
            margin-top: 50px;
        }

        .block1
        {
            outline: 2px solid black;
            height: 200px;
            margin: 2px;
        }
    </style>    
</head>
<body>
    <div id="wrapper">
        <br><br>
        <div class="block1">Halo!</div>
    </div>
</body>
</html>


Добавлено через 12 минут и 12 секунд
Предпросмотр:
http://jsbin.com/omece3/edit


--------------------
SimpleFit.ru - блог о том, как заниматься спортом нормальным людям
--
Стимул работы в Сибири - комары.
PM MAIL   Вверх
SelenIT
Дата 28.1.2011, 14:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401
Цитата(NCIAC @  28.1.2011,  03:07 Найти цитируемый пост)
нельзя

аргументируйте ;)


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
Addmin
Дата 29.1.2011, 19:48 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 803
Регистрация: 3.2.2006
Где: сослан в Сибирь

Репутация: нет
Всего: 15
Ах да, IE 7 не понимает outline. Просто замените в примере outline на бордер smile


--------------------
SimpleFit.ru - блог о том, как заниматься спортом нормальным людям
--
Стимул работы в Сибири - комары.
PM MAIL   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0474 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.