我正在创建类似博客的网站。帖子页。
我需要左容器做出响应，右容器保持固定的姿态。右侧将用于广告和相关帖子。
因此，当页面调整大小时，左侧会像博客一样缩小。
在下面的示例中，它没有按预期发生。
我正在使用浮动元素，是否有更好的方法来使用它们？
我如何获得这种效果？
.container{
max-width: 1260px;
background: red;
height:auto;
padding: 0;
margin: 0 auto;
text-align: center;
font-size: 0;
}
.left_container{
float:left;
width:780px;
background: orange;
height:1800px;
padding: 0;
margin: 0 auto;
text-align: center;
font-size: 12px;
}
.right_container{
float:right;
width: 420px;
background: yellow;
height:800px;
padding: 0;
margin: 0 auto;
text-align: center;
font-size: 12px;
}
.clearfix{
clear: both;
overflow: auto;
zoom: 1;
height: 1%;
display: block;
}<div class="container">
<div class="left_container">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin auctor mauris eget rhoncus auctor. Fusce nec tellus bibendum, sodales massa id, imperdiet tortor. Aliquam sagittis accumsan nisi, eget hendrerit ipsum maximus ut. Integer ac tristique lacus. Vestibulum ultrices eu ante vitae pharetra. Nunc ut velit malesuada, convallis felis eget, mollis lacus. In in euismod ipsum, ac dapibus metus. Quisque id justo malesuada, hendrerit velit quis, fermentum purus. Cras dictum tortor varius lacus dapibus pellentesque. Morbi ultrices sodales porttitor. Donec vestibulum efficitur aliquet. Donec iaculis, libero consectetur interdum tincidunt, erat metus vulputate ligula, ut consequat lorem quam non lorem. Fusce justo turpis, pharetra a hendrerit eu, hendrerit et turpis. Phasellus in volutpat elit.
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum congue tellus eu elit placerat, id placerat eros molestie. Etiam varius dolor et tortor tempus mattis. Donec id justo ut erat consequat volutpat. Aliquam pretium arcu et ullamcorper condimentum. Donec vitae nulla est. Duis iaculis quis ipsum eget maximus. Cras consectetur lectus in mollis porttitor. Donec commodo convallis risus, non tristique ipsum posuere vel. Suspendisse id tortor pharetra, molestie justo dignissim, pharetra purus. Curabitur quis mauris vel neque egestas rutrum. Nulla pulvinar dapibus felis ut aliquet. Suspendisse lacinia sagittis tellus nec vehicula.
Nam nec libero a lorem pulvinar hendrerit. Ut consectetur erat in auctor suscipit. Duis magna quam, mattis sodales dignissim sit amet, porttitor tempor sem. Aliquam lobortis libero et tincidunt semper. Aliquam egestas sit amet felis non elementum. Nullam eget bibendum ligula, nec volutpat tellus. Etiam porttitor rutrum augue non tristique. Suspendisse potenti. Vestibulum tincidunt, felis nec congue pharetra, dolor nibh congue diam, nec ultrices metus nulla ut magna. Mauris tincidunt consequat congue. Curabitur a ultricies lectus, sed faucibus lacus. In facilisis, nisl sit amet commodo semper, orci sapien vestibulum leo, sed commodo nibh metus et odio. Morbi tincidunt ante odio, et dapibus magna rhoncus sed. Ut mattis eget arcu id venenatis. Sed quis tortor arcu. Praesent fermentum vulputate quam, porta pharetra lorem pretium non.
Duis ut varius arcu. Duis lacinia tempor ullamcorper. In pretium arcu facilisis, convallis nibh id, egestas purus. Proin varius viverra quam, laoreet maximus velit pharetra vel. Nullam in diam in velit iaculis sagittis id id lectus. Nunc in dolor placerat, pellentesque sem vel, convallis lorem. Praesent sit amet pharetra diam, ut semper magna. Morbi massa lacus, pretium et auctor mattis, rutrum at odio. Fusce ac commodo velit, vitae molestie ex. Praesent placerat libero quis nisl consectetur, id aliquam felis ornare. Ut accumsan felis congue, semper nibh non, vehicula mauris. Nullam lacinia egestas vulputate. Nullam iaculis, nisl sed luctus vulputate, eros tortor pulvinar ex, sed congue magna augue at purus. Sed vel tempor est. Aliquam sit amet nisl sem.
Vestibulum sit amet condimentum turpis. Etiam ex magna, efficitur eu faucibus eu, lobortis eget orci. Maecenas vel massa elit. Suspendisse lobortis nisi erat, nec condimentum dui consectetur eget. Sed nec risus vitae neque aliquet porta. Morbi viverra quam massa, eu rhoncus metus consectetur sed. Nunc libero nisi, consequat blandit tortor eget, ultricies aliquam ipsum. Quisque rhoncus sem ut magna viverra commodo. Nunc maximus ullamcorper ipsum in rhoncus. Nam orci nulla, sodales in aliquam sit amet, semper sit amet ante.
Curabitur quis aliquam purus. Etiam dictum eget leo sit amet vulputate. Donec fermentum rutrum porta. Nam at magna aliquet, porttitor purus et, condimentum dui. Fusce et urna pellentesque lectus molestie iaculis. Maecenas et semper est. Donec magna dui, malesuada a varius sed, pellentesque vitae odio. Morbi nisl est, egestas a accumsan ut, laoreet at sapien. Vestibulum semper non sapien quis blandit. Sed sed magna non turpis feugiat eleifend. Ut dapibus et sem at dignissim.
Quisque erat est, placerat maximus fringilla sed, lobortis vel dui. Maecenas bibendum viverra feugiat. Etiam et viverra nulla. Sed tristique mollis est ut congue. Pellentesque nec eleifend eros, a fringilla massa. Sed molestie vitae lorem nec placerat. Aliquam lorem lorem, porttitor eu commodo ac, sodales efficitur ex. Donec mattis felis sit amet massa dapibus commodo. Duis pellentesque neque at ligula convallis, ac mollis dolor pulvinar. Vivamus enim leo, consequat in orci sit amet, accumsan pharetra odio. Nunc a luctus nunc, non rutrum neque. Suspendisse egestas, ex sed rutrum molestie, mauris urna facilisis ex, sit amet commodo lectus mauris quis sem. Aliquam lacinia aliquet urna ac facilisis. In vitae risus velit.
Sed magna leo, maximus eu vehicula vel, congue a magna. Morbi quam libero, sollicitudin id lobortis nec, interdum id eros. Suspendisse potenti. Praesent porta, sapien ac placerat tempor, ex libero sodales purus, at hendrerit diam augue vitae diam. Duis nec venenatis enim, id rhoncus lacus. Suspendisse sit amet convallis lorem. Nulla nec sapien ut lectus vulputate suscipit. Fusce pharetra quam nec volutpat vestibulum. Morbi magna diam, mollis luctus arcu in, consequat lobortis velit. Duis sed lacus ac erat dapibus dapibus. Morbi velit turpis, sodales nec imperdiet nec, semper in sapien.
Aenean pretium ullamcorper lorem sed auctor. Sed suscipit fermentum varius. Etiam lacinia consequat egestas. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras fermentum convallis tristique. Cras nec tellus a leo faucibus sagittis. Phasellus in dignissim tellus, nec imperdiet odio. Praesent condimentum diam sapien. Duis eu est ligula. Cras in nulla at dolor ullamcorper accumsan. Nunc at rhoncus est. Nullam porttitor est sed dolor euismod, ac sollicitudin metus egestas. Cras id mi tincidunt, auctor est sed, euismod ligula.
Cras neque tellus, iaculis vitae condimentum accumsan, fringilla non ipsum. Quisque at viverra nunc. Fusce semper accumsan arcu. Morbi facilisis nec massa vitae rhoncus. Duis eu neque a mauris ullamcorper interdum eget a elit. Aenean pulvinar massa diam, eu sollicitudin justo consequat euismod. In pharetra urna tortor, vitae elementum enim tincidunt nec. Vivamus placerat scelerisque congue.</div>
<div class="right_container">right side</div>
<div class="clearfix"></div>
</div>