Сайдбар уехал под контент

[alex89]

Подскажите как сделать сайдбар справа, при уменьшении этого параметра

#contentwrap {

background: #FFFFFF;

border: 1px solid black;

width: 770px;

}

сайдбар уходит под конент,вот css сайдбара

/* SIDEBAR(S) */

.sidebaradbox {

margin-top: 0px;

text-align:center;

}

.ad125 {

margin: 6px;

}

.sidebar {

margin-left:20px;

font-size: 15px;

font-style: oblique;

color: #0000ff;

width: 310px;

background: #fff;

text-align: left;

}

.sidebar a {

text-decoration: none;

color: #6D6D6E;

}

.sidebar a:hover {

text-decoration: underline;

color:#0000ff;

}

www.pechati89.ru

Edited July 14, 2012 by alex89

[malsyst]

Подскажите как сделать сайдбар справа, при уменьшении этого параметра

#contentwrap {

background: #FFFFFF;

border: 1px solid black;

width: 770px;

}

сайдбар уходит под конент,вот css сайдбара

/* SIDEBAR(S) */

.sidebaradbox {

margin-top: 0px;

text-align:center;

}

.ad125 {

margin: 6px;

}

.sidebar {

margin-left:20px;

font-size: 15px;

font-style: oblique;

color: #0000ff;

width: 310px;

background: #fff;

text-align: left;

}

.sidebar a {

text-decoration: none;

color: #6D6D6E;

}

.sidebar a:hover {

text-decoration: underline;

color:#0000ff;

}

www.pechati89.ru

Посмотри вот этот вариант

[USF]

какая-то дикая верстка.

что мешает сделать глобальный блок wrapper(width + margin: auto) и в него вложить 2 блока(контент и сайдбар) с float: left?

[malsyst]

Можно сделать так:

<div id="wrapper">
	<div id="middle">
		<div id="container">
			<div id="content">
			<p>текст</p>
			</div><!-- #content-->
		</div><!-- #container-->
		<div class="sidebar" id="sideLeft">
		<p>текст</p>
		</div><!-- .sidebar#sideLeft -->
	</div><!-- #middle-->
</div><!-- #wrapper -->


#wrapper {
	width: 1000px;
	margin: 0 auto;
}

/* Middle
—————————————————————————--*/
#middle {
	width: 100%;
	height: 1%;
	position: relative;
}
#middle:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
#container {
	width: 100%;
	float: left;
	overflow: hidden;
}
#content {
	padding: 0 0 0 270px;
}


/* Sidebar Left
—————————————————————————--*/
#sideLeft {
	float: left;
	width: 250px;
	margin-left: -100%;
	position: relative;
	background: #B5E3FF;
}