Привет!
Есть несколько вопросов по верстке в див-ах, буду рад помощи:
1.Есть 2 див а, в одном меню, в другом контекст. Как можно поставить их рядом,но без абсолютного позиционирования?
2.Как можно сделать чтоб эти самые дивы меняли размеры в соответствии с размерами окна, а именно один див оставался без изменений а другой  закрывал остальную часть страницы?
3.как можно в CSS скажем изображение поставить в центр див-а (как <center></center> в HTML)?

Я конечно могу все это сделать как нибудь  вручную, с помощю JS или еще чего, но уверен что css дает такую возможность!

NNaarreekk, 
чтобы один див был справа используйте свойство CSS: 

Чтобы скажем див меню был фисированной ширины что слева: задайте ему размер с помощью CSS свойства: 
а второму неуказывайте размер ширины и он займет все пространство родительского элемента, если родительский элемет (тег): body -тогда до края окна (по ширине) браузера.

изображение можно поместить в центр, например задав диву (div) свойство CSS: 


Надеюсь я правильно понял Вашу задачу

Это сообщение отредактировал(а) Forsaken - 8.2.2009, 16:05

Работает тока в IE.


Можно пример, а то я не понял как это реализовать?

Можешь написать пример, что рядом были 2 дива, один зеленный с шириной 250px и высотой 100% и рядом красный див ширина все остальное место и высота тоже 100%?
Буду очень благодарен!

http://www.htmlbook.ru/css/text-align.html
Применять можно непосредственно к <img> который в нутри блока
(поже еще напишу про float)

Здесь ничего не нашел про img, сам проверил не сработало.


Оба этих варианта не работает.
Ты использовал этот метод?

NNaarreekk, 


проверил на
Firefox 3.x, Opera 10, IE 6, Safari 3.1, Google Chrome (All)

Используйте двойные кавычки  для атрибутов
Иногда может понадобится для блоков конструкция типа: margin-left:auto; margin-right:auto (например чтобы отцентрировать весь документ... и т.д.)

Приду, сейчас напишу про float

Это сообщение отредактировал(а) Forsaken - 8.2.2009, 18:57

Это работает только в IE.

NNaarreekk, 
лично проверил в Firefox 2.2, Firefox 3.x, Opera 9.6, Opera 10, IE 6, Safari 3.1, Google Chrome (All), NN 8.1.2
У меня все работает.

Если применить text-align для img то это будет действовать только в потоке текста.

Работает но в IE6 есть баг визуализации, обойти можно задав margin-right для блока слева отрецательным в три пиксела так:


Это сообщение отредактировал(а) Forsaken - 8.2.2009, 21:56

Forsaken, Спасибо, то что надо!

А для text-align все-таки появляются неточности, но не могу сейчас найти (у меня на нескольких сайтах возникала эта проблема!)

NNaarreekk, 
про баг в IE6 всеже почитайте чтонибудь.. может возникнуть проблема и с отрицатльным отступом..

Что касается text-align -то  если не выйдет кидайте сюда конкретный код.. так будет проще

Короче чтобы избежать всех багов в ie6 сделайте так лучше:


Если в документе не указать DOCTYPE, то данный отступ будет иметь место и в IE 7

Если ктонить знает как это решить лучше на этом примере отпишите сюда!

Это сообщение отредактировал(а) Forsaken - 9.2.2009, 09:13

Forsaken, 
не совсем правильно
Вы ограничили блоки по высоте. Если уберете в левом блоке бэкграунд, то увидите что правый блок будет под левым, поэтому там не нужно ставить width:100%. У правого блока поставить margin-left на ширину левого блока. Да и для ие6 не нужно ничего делать.

Violator, 
Да width:100% это избыточное свойство.
Только с margin-left:250px для правого блока невыходт -вот пример:

Проблема в ie6 остается..

Forsaken, 
какая проблема?

Violator,
3px margin баг в ie 6 и более ранних

Если честно мне

вот столько достаточно, но считаю что считаю что дискуссия должна продолжится раз есть проблема, так сказать для будущих поколений)

А по теме, когда добавляю:

то 3 пикселя пропадают, но зато height:100% не работает!

Forsaken, 
нууу, например, вставить в правой колонке внутренний блок с float и растянуть на 100%

NNaarreekk, 
Правильно что неработает) Раз уж взялись соблюдать стандарты XML(XHTML) делайте это доконца) и для body добавьте height:100%


Добавлено @ 20:52
Violator, 



Неработает. 
И для левого если вставить и растянуть тоже небудет работать... (да и как это может помочь если он займет 100% блока который имеет непонятный отступ 3px от соседа)

Это сообщение отредактировал(а) Forsaken - 9.2.2009, 21:55

Forsaken, 
блок с float и растянуть на 100%

ps хотя да, проверил не работает, но думаю решение найти можно

Это сообщение отредактировал(а) Violator - 9.2.2009, 21:13

Violator, 
Я Вас очень понимаю.. неуклюжая конструкция.. 

А если посмотреть что предлагают -чтобы это в IE Mac заработало, можно просто охренеть... -какие уж там стандарты W3C

Это сообщение отредактировал(а) Forsaken - 9.2.2009, 21:23

Forsaken, 

Violator, Я уж не могу уследить за вашем с Forsaken разговором, но последнее написанное не работает в ИЕ7(не работает высота 100%).
Люди я шас заплачу уже, неужели это такая сложная задача??
С внутренним дивом тоже не работает!  

NNaarreekk, 
для body сделайте height:100% в XHTML нужно указывать размер body по выстоте явным образом (как для div блоков)



Violator


Стоит в Ваш код добавить height:100% для блока спарва как все развалится (потому что баг в ie почемуто непроявляется с минимальным значением height)

Это сообщение отредактировал(а) Forsaken - 9.2.2009, 22:12

Forsaken, последний код в ИЕ7 тоже не пашет  

NNaarreekk, 
html {height:100%}


Forsaken, 
хм... ну значит для ие6 таки придется использовать предложенный вами способ  

NNaarreekk, 
я порой в шоке от себя.. только что тут распинался о xhtml стандартах...  


Violator
Там в сети этих способов столько было, что  я уверен в том что этот способ еще чейто уже давно..)

Прошу прощения всех за мой тупняк.. я больше небуду!

Это сообщение отредактировал(а) Forsaken - 9.2.2009, 23:22

Forsaken, Violator, спасибо за помощь!
Последний код работает как надо. Долгими стараниями мы пришли к нему)

Хотел тему отметить решенным, а оказалось давно это сделал  

Всем привет.
Напишу здесь, чтобы не создавать новую тему. На другом форуме ничем особо не помогли http://demiart.ru/forum/index.php?showtopic=100755&st=0 Там даже ответов не дождешься.

Только начал это все изучать. Таблицами верстать даже легко показалось, а вот блоками :(((.
Сайт: http://pasha4ur.narod.ru/
Правда уже рдин человек помог. Спасибо ему за это. До него норально вели себя только облака.

Проглядывал статьи по блочной верстке.

Есть много тупых вопросов.

1. 3-ех колоночный дизайн:

Это позволяет не расплываться слоям. Как оно работает? Граница браузера просто наезжает на 150 на сам слой и поэтому он не соскакивает вниз?

и цитата с другого форума:


http://pasha4ur.narod.ru/

Вторую проблему исправили хз как. У меня было все абсолютно выровнено. Заменили часть на относительное.

На весь экран, когда контент меньше 100% от кол-ва пикселей на экране пользователя. Как пустой слой растянуть на 100%, а когда много содержимого, то чтобы он растягивался вместе с ним :я не знаю: 

И вот это интересно:


Читал много раз, но еще путаюсь в относительном/абсолютном. 

Относительное - винимается из основного потока и перемается на заданное смещение относительно того места, на котором должен был быть. Следующие слои располагаются как-будто он на своем месте был.

Абсолютное - винимается, выравнивается от границ родительского элеента. Не влияет на расположение других.

Все правильно?