проблема с рамкой

[b1ot3kk]

вот не знаю как решить проблему, вот собственно в чем проблема: (на задний фон не обращайте внимания, это так, тест)

что для этого используется: (углы там естественно прозрачные)

код html:

<div id="center">
    <div id="sidebarbg">
        <div id="page">
            <div class="top">
                <div class="btm">
                    <div id="content">
                            123123213<br />   
                            123123213<br /> 
                            123123213<br /> 
                            123123213<br /> 
                            123123213<br />   
                            123123213<br /> 
                            123123213<br /> 
                            123123213<br />
                            123123213<br />   
                            123123213<br /> 
                            123123213<br /> 
                            123123213<br />
                    </div>
                </div>    
            </div>
        </div>
    </div>
</div>

код css:

#center {
    padding: 0;
    margin: 0 auto;
    background-color: fuchsia;
    width: 700px;
    height: 500px    
}

#sidebarbg {
	width: 200px;
	margin: 0 auto;
	padding: 0;
	background: url(images/sidebarbg.gif) repeat-y left top;
} 

#page {
	width: 200px;
	margin: 0 auto;
}    


#page .top {
	background: url(images/sidebartop.gif) no-repeat left top;
}

#page .btm {
	background: url(images/sidebarbtm.gif) no-repeat left bottom;
}


#content {
	width: 200px;
	margin: 0 auto;
	padding: 15px 0 15px 15px;
}

ответ как всегда бывает скорее всего простой, но что то не соображу

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

Edited July 20, 2011 by b1ot3kk

[Temiks]

для .top задайте margin-top: -5px (для примера) и для .btm margin-bottom: -5px(для примера);

[b1ot3kk]

сдвинулся сам центральный блок link

[Softlink]

эээээх я бы это все border-radius'ом замонстрячил

Следуйте заветам Яндекса - Graceful Degradation Они не стесняются так делать. Ну не показывает у пользователя круглые углы, ну значит он сам себе злобный Буратино, как здесь говорят)) И заказчику бы попробовал это объяснить.

[Temiks]

Сделайте тогда так

<div class="top">
    <div class="btm">
         <div id="sidebarbg">
              Текст
         </div>
    </div>
</div>

В этих классах оставить только бг и дописать к top

margin: auto;

width: 200px;

дописать к btm

padding: (вверх и низ = столько сколько есть размер прозрачной картинки = ее высота )

Тоесть исходный код выйдет такой в css

.top {
margin: auto;
width: 200px;
bg
}
.btm {
padding: (вверх и низ = столько сколько есть размер прозрачной картинки = ее высота )
bg
}
.sidebarbg {
bg
}

[b1ot3kk]

эээээх я бы это все border-radius'ом замонстрячил

Следуйте заветам Яндекса - Graceful Degradation Они не стесняются так делать. Ну не показывает у пользователя круглые углы, ну значит он сам себе злобный Буратино, как здесь говорят)) И заказчику бы попробовал это объяснить.

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

Edited July 20, 2011 by b1ot3kk

[b1ot3kk]

html

css

result

Edited July 20, 2011 by b1ot3kk

[b1ot3kk]

я дико затупил что sidebarbg у нас id а не class) теперь вроде бы все работает, сейчас по-тестю

[Temiks]

sidebarbg как я понял отвечает за повторение по оси у? Тогда должно все работать, проверьте еще раз внимательно, для примера поставьте ему другой цвет

я дико затупил что sidebarbg у нас id а не class) теперь вроде бы все работает, сейчас по-тестю

ok

[b1ot3kk]

да, пока все работает, спасибо

.

странно что пишет, мол я уже поднимал репутацию, хотя я этого еще еще не делал,так что завтра поставлю +