X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Размещение блоков
glorin
glorin
Topic Starter сообщение 14.3.2011, 4:31; Ответить: glorin
Сообщение #1


Доброго времени суток!
Я в css начинающий, так что строго прошу не судить... Есть следующий макетик:
[attachment=37598:maket_1.png]

1. Как правильно разместить синий и зеленый блоки ? Я всем блокам (кроме зеленого) задал position:relative, float:left; зелёному же прописал position:absolute и проставил координаты. Но в IE он у меня почему-то ен отобразился, хотя в хроме всё ок (больше прямо сейчас под рукой браузеров нет, потому ничего сказать не могу)
2. Как сделать вторую "строку" блоков ? Я сиреневому блоку присвоил значение clear:left, float:left; он у меня вниз переместился... но при добавлении голубого блока в хроме он у меня отображается на своем месте, а в IE - под тем местом, где должен быть зеленым...

Очень надеюсь, что кто-то укажет мне на мои лажи ! Заранее очень благодарен!

P.S. При позиционировании хотелось бы не использовать никаких промежуточных блоков... Контейнером является белый блок, который вокруг них всех..
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Tigor.v
Tigor.v
сообщение 15.3.2011, 14:07; Ответить: Tigor.v
Сообщение #2


лучше если код будет)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
glorin
glorin
Topic Starter сообщение 15.3.2011, 22:35; Ответить: glorin
Сообщение #3


Ну, вот кривой мой код

<html>
<head>
<style type="text/css">
body {margin: 0px; background:#333;}
#all {width: 1300px; height: auto; left:50%; margin-left: -650px; position:relative; background-repeat: repeat-y; padding-top:5px;}
#main {width: 992px; background:#ffffff; background-repeat: repeat-y; height:auto; left:50%; margin-left:-496px; position:relative; padding: 5 11 5 11; overflow:hidden;}
#slider {background:#ff0000; height:270px; width:480px; position:relative; margin-bottom:5px; float: left; margin-right:5px;}
#radio {background:#006699; height:56px; width:240px; position: relative; float: left; margin-right: 5px;}
#days {background:#990066; height:209px; width:240px; position: absolute; margin-right: 5px; left:496px; top:66px;}
#ticket {background:#660099; height:270px; width:240px; position: relative; float: left; margin-right: 5px;}
#news {background:#009966; height:209px; width:238px; position: relative; float: left; margin-right: 5px;clear:left;}
#events {background:#996600; height:209px; width:237px; position: relative; float: left; margin-right: 5px; clear:right;}
</style>
</head>
<body>
<div id="all">
<div id="main">
<div id="days">1</div>
<div id="slider">2</div>
<div id="radio">3</div>
<div id="ticket">4</div>
<div id="days">5</div>
<div id="news">6</div>
<div id="events">7</div>
</div>
</div>
</body>
</html>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
glorin
glorin
Topic Starter сообщение 21.3.2011, 0:14; Ответить: glorin
Сообщение #4


Помогите плиз, очень нужно...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
adlic
adlic
сообщение 21.3.2011, 0:59; Ответить: adlic
Сообщение #5


Может намудрил и проще сделать можно было, но так в mazila, google chrome и IE показывает одинаково и вроде даже правильно)
<html>
<head>
<style type="text/css">
body {margin: 0px; background:#333;}
#all {width: 1300px; height: auto; left:50%; margin-left: -650px; position:relative; background-repeat: repeat-y; padding-top:5px;}
#main {width: 992px; background:#ffffff; background-repeat: repeat-y; height:auto; left:50%; margin-left:-496px; position:relative; padding: 5 11 5 11; overflow:hidden;}
#days {background:#990066; height:212px; width:240px; position: relative; margin-right: 5px;top:58px; float:left;}
#slider {background:#ff0000; height:270px; width:485px; position:relative; margin-bottom:5px; float: left; margin-right:5px;}
#radio {background:#006699; height:56px; width:240px; position: relative; float: left; margin-right: 0px; top:0px; right:245px;}
#ticket {background:#660099; height:270px; width:240px; position: relative; float: left; top:-56px; margin-right: 5px; }
#news {background:#009966; height:209px; width:240px; position: relative; float: left; top:-51px; margin-right: 5px; clear:both;}
#events {background:#996600; height:209px; width:240px; position: relative; float: left; top:-51px; margin-right: 5px; }
#events8 {background:#995670; height:209px; width:240px; position: relative; float: left; top:-51px; margin-right: 5px; }
#events9 {background:#991120; height:209px; width:240px; position: relative; float: left; top:-51px; margin-right: 5px; }

</style>
</head>
<body>
<div id="all">
<div id="main">
<div id="slider">2</div>
<div id="days">1</div>
<div id="radio">3</div>
<div id="ticket">4</div>
<div id="day">5</div>
<div id="news">6</div>
<div id="events">7</div>
<div id="events8">8</div>
<div id="events9">9</div>
</div>
</div>
</body>
</html>


Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Пакетное размещение статей по разным тематикам. Скидки!
35 kasey7 10650 26.3.2024, 15:47
автор: kasey7
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыРучное размещение вечных ссылок и статей на хороших площадках
Опыт 10 лет!
419 leonidukg 273837 12.3.2024, 15:17
автор: leonidukg
Горячая тема (нет новых ответов) Статейные ссылки. Ручное размещение. Средний тИЦ - 500+
113 creatos 47683 11.3.2024, 18:21
автор: xVOVAx
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыРучное размещение объявлений и компаний по популярным доскам и каталогам организаций России, Украины, Беларуси и Казахстана
37 freeax 27824 6.3.2024, 20:57
автор: freeax
Открытая тема (нет новых ответов) Размещение 3500+ анкорных ссылок в статьях-заметках
2 seostock 1204 14.1.2024, 1:20
автор: Zuzj


 



RSS Текстовая версия Сейчас: 29.3.2024, 9:32
Дизайн