Не могу разобраться с CSS

[Narvell3]

Добрый день всем.
Я вот покакому поводу к вам.Уменя есть готовый сайт но надо его немного подкоректировать тоесть изменить, там таблицу стилей.Уменя сним загвозка такая мне надо чтоб те блоки которые поцентру чтоб один блок был сдругой а другой блок был рядом сним но растянут как это сделать вот мой код style.css

@import url('reset.css');
@import url('typography.css');
body {
background-color: #f8f8f8;
margin: auto;
width: 100%;
}

div#status-bar {
background: url('../img/status-bar-bg.png') repeat-x;
border-bottom: 2px groove #ffffff;
height: 40px;
width: 100%;
}

div#status-bar-content {
margin: 10px auto 0px auto;
width: 800px;
}

div#status-bar-commands {
width: 400px;
}

form#search-form {
float: right;
width: 200px;
}

p#welcome {
float:left;
padding-top: 7px;
width: 150px;
}


p#action-bar {
background: url('../img/action-bar-bg.png') no-repeat;
height: 14px;
margin-left:200px;
padding: 8px 28px;
width: 154px;
}

p#action-bar a:before {
content: '| ';
}

p#action-bar a[title="License"]:after {
content: ' |';
}

form#search-form input[type="text"] {
background: url(../img/search-field.png) no-repeat;
border:none;
height:20px;
padding: 5px 0px 0px 30px;
width:170px;
}

form#search-form input[type="submit"] {
display: none;
}

div#header {
background: url('../img/header-image.jpg') no-repeat center;
background-color: #6eb9cc;
border-bottom: 2px ridge #ffffff;
height: 250px;
width: 100%;
}

div#logo {
margin: auto;
padding-top: 35px;
width: 800px;
}

div#content-top-shadow {
background: url('../img/content-top-shadow.png') repeat-x;
height: 20px;
width: 100%;
}

div#content-bottom-shadow {
background: url('../img/content-bottom-shadow.png') repeat-x;
clear: both;
height: 20px;
width: 100%;
}

div#content {
margin: auto;
padding-bottom: 50px;
position: relative;
width: 800px;
}

div#page-wrapper {
background-color: #ffffff;
border: 1px solid #bababa;
clear: both;
height: 233px;
margin-top: 75px;
overflow: hidden;
padding: 15px;
width: 768px;
}

div#slideshow {
border-right: 1px solid #b2b2b2;
float: left;
padding-right: 15px;
width: 375px;
}

div#slides {
border: 1px solid #a7a7a7;
height: 200px;
width: 370px;
}

div#slides a.thumb {
display:none;
}

div#slides a.default-slide {
display:block;
}

div#slideshow-commands {
background: url('../img/commands-bg.png') no-repeat;
height: 19px;
left: 15px;
padding: 3px 25px;
position: relative;
width: 290px;
}

a#previous-slide {
background: url('../img/commands-previous-slide.png') no-repeat;
display: block;
float: left;
height: 12px;
margin-top: 2px;
text-indent: -9000px;
width: 9px;
}

a#next-slide {
background: url('../img/commands-next-slide.png') no-repeat;
display: block;
float: right;
height: 12px;
margin-top: 2px;
text-indent: -9000px;
width: 11px;
}

div#slideshow-commands h4 {
margin-top:1px;
width:100%;
}

div#message {
margin-left: 410px;
width: 350px;
}

div#message h3 {
margin-bottom: 20px;
}

p#contact-info span {
display: block;
}

span#phone {
background: url('../img/phone-icon.png') no-repeat 0px 1px;
float: left;
margin-top: 25px;
padding-left: 35px;
width: 125px;
}

Строка кода которая отвечает за блоки div#page-wrapper там содержиться эти два блока Slideshow и Mesage просто тот блок Mesege мне надо чтоб он был рядом с блоком Slideshow и растянут до конца и между Slideshow и Mesage был промежуток который бы их разделял
Прошу помощи у вас

[megarazum]

Вы знакомы с запятыми? и по пунктам. соотнесите идентификаторы к слоям (блокам)

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

[Magneto]

Не получается правильно задать вопрос? Рисуй.

[Wicort]

ух, какая, действительно, мудреная игра слов) аж мозг вскипел)
нарисуйте, как должно выглядеть