Буллет

Ясно, спасибо. Но есть просьба, не могли бы вы показать на этом примере использование инлайн-блоков?

Ну тогда получается, что правый блок сдвигается левее, чтобы влезла вся тень. Это не совсем то, так как в дизайне выше есть еще блок такой же ширины, и выглядит это криво. Ну и ширину общего блока не хотелось бы увеличивать, а потом сдвигать правый блок левее, чтобы выглядело ровно.

Добрый день. http://jsfiddle.net/X4kbR/2/ Подскажите пожалуйста, как сделать так, чтобы была видна тень у правого, внутреннего блока справа. При этом желательно не увеличивать ширину внешнего блока. <div class="main"> <div class="left"></div> <div class="right"></div> </div> .main { width:200px; overflow:hidden; height:100px; } .left { float:left; background-color:red; width:50px; height:50px; } .right { float:right; background-color:blue; width:50px; height:50px;box-shadow: 3px 3px 5px 0px ; }

alexandr_v-vich, спасибо. получилось. http://jsfiddle.net/uGbRM/1/

Хорошо спасибо за такой, как мне кажется, странный способ. Чуть позже начну разбираться. По окончанию отпишусь.

Это какая-то фантастика. Так не работает. Она не растягивается по высоте.

Чет немного не понял. Можете на примере показать?

_http://janicky.com/content/article_10.html Думаю это подойдет для ваших целей. Сам её использую.

Добрый день. Уже долго думаю, как сделать так, чтобы сверстать вот такой элемент сайта так, чтобы он был резиновым по высоте. Ну и соответственно текст внутри этой книги начинался сверху. Сама книга состоит из трех частей: верхней, средней (полоска высотой в несколько пикселей) и нижней. Подскажите пожалуйста, как это сделать. Заранее благодарю.

Тогда скролл снизу вообще не появляется, когда ширина экрана <1000px И если обрамить див с картинкой в <div style="float:right"></div> то картинка не отображается

_http://srn.kz/

Как это исправить, не подскажите? И еще сделать блок шириной 1100px как на рисунке в первом посту?

Спасибо большое. Теперь работает почти как нужно. Вот только фон у резиновой шапки пропадает, если мотнуть скроллом вправо, когда ширина экрана меньше 1000px

Не получается. Вот как делал .main { width:100%; } .main_resize { margin:0 auto; width:1000px; } .main_head { background:url('../images/head.png') no-repeat right top; height:533px; width:725px; margin-left:50%; position:relative; } <div class="main"> <div class="main_resize"> <div class="main_head"></div> </div> </div>

Нужно, чтобы картинка 725*533 стояла на одном месте (Как на рисунке в первом посте), независимо от размера экрана. Получается если ширина экрана больше ~1150, то эта картинка показывается полностью. Если ширина экрана 1000px, то ~150px этой картинки скрываются справа (!скролл снизу не появляется). Если ширина экрана меньше 1000px, то появляется внизу браузера скролл, который показывает 1000px; Не знаю как больше объяснить В последнем варианте картинка двигается в зависимости от размера экрана. В других вариантах, не работает вообще (Как понял, так сделал, может и не так как задумывал автор поста)