0
我想不出一个简单的方法来解释这一点，所以我会用图像做：制作格填充剩余空间动态
这里是一个粗略的小提琴是我目前为止：https://jsfiddle.net/a9gnx79h/
纯粹的CSS解决方案将是可取的，但我可以在必要时使用jQuery。从小提琴
代码：
HTML
<div id="main_content">
<aside id="sidebar">
</aside>
<h2 class="title">Blog Post<span>posted 1/2/2015 by <a>User</a></h2>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<p>Dicunt voluptatibus definitionem mel at, eu tritani gloriatur instructior cum. Cum id euismod luptatum, everti saperet ei nec. Vel meis brute graeci cu, nonumy officiis complectitur ei pro.
An sed accumsan convenire, movet nemore ut his.</p>
<p>Sit mentitum instructior ex. Exerci ornatus cum te. Zril pertinax comprehensam vel ex. Tantas lucilius antiopam sit et.</p>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<h2 class="title">Blog Post<span>posted 1/2/2015 by <a>User</a></h2>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<p>Dicunt voluptatibus definitionem mel at, eu tritani gloriatur instructior cum. Cum id euismod luptatum, everti saperet ei nec. Vel meis brute graeci cu, nonumy officiis complectitur ei pro.
An sed accumsan convenire, movet nemore ut his.</p>
<p>Sit mentitum instructior ex. Exerci ornatus cum te. Zril pertinax comprehensam vel ex. Tantas lucilius antiopam sit et.</p>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<h2 class="title">Blog Post<span>posted 1/2/2015 by <a>User</a></h2>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<p>Dicunt voluptatibus definitionem mel at, eu tritani gloriatur instructior cum. Cum id euismod luptatum, everti saperet ei nec. Vel meis brute graeci cu, nonumy officiis complectitur ei pro.
An sed accumsan convenire, movet nemore ut his.</p>
<p>Sit mentitum instructior ex. Exerci ornatus cum te. Zril pertinax comprehensam vel ex. Tantas lucilius antiopam sit et.</p>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<h2 class="title">Blog Post<span>posted 1/2/2015 by <a>User</a></h2>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
<p>Dicunt voluptatibus definitionem mel at, eu tritani gloriatur instructior cum. Cum id euismod luptatum, everti saperet ei nec. Vel meis brute graeci cu, nonumy officiis complectitur ei pro.
An sed accumsan convenire, movet nemore ut his.</p>
<p>Sit mentitum instructior ex. Exerci ornatus cum te. Zril pertinax comprehensam vel ex. Tantas lucilius antiopam sit et.</p>
<p>Lorem ipsum dolor sit amet, ex eros epicuri elaboraret mel, ridens eruditi commune ei vim, no est possit meliore corrumpit. Saperet fabellas mea eu, quo in sanctus verterem.
Et propriae inimicus deseruisse sed. Ius nulla mandamus definitionem et, forensibus conclusionemque mel ad. Duis sonet quando et sit, et omnesque fabellas concludaturque vel.</p>
</div>
CSS
#main_content
{
background-color: rgba(30, 30, 30, 1);
color: rgba(200,200,200,1);
width: 95%;
min-height: 50rem;
border-width: 10%;
margin-top: 3rem;
margin-left: auto;
margin-right: auto;
padding: 1rem;
}
#sidebar
{
float: right;
padding: 1.5rem;
margin-right: 1rem;
background-color: rgba(255, 0, 0, 1);
display: inline;
width: 10%;
height: 30rem;
}
.title
{
background-color: rgba(0, 00, 255, 1);
padding-top: 1rem;
padding-bottom: 1rem;
padding-right: 1rem;
padding-left: 1rem;
font-weight: bold;
display: block;
position: relative;
}
.title span
{
float: right;
font-size: 50%;
font-weight: normal;
}
可以改变html的结构吗？ –