<div class="wrapper">
<div class="title">
<h1>Minimal Blog Page Layout</h1>
</div>
<div class="mainColumn">
<h1>Heading</h1>
<p>Why I say old chap that is spiffing chinwag starkers posh grub mufty tosser excuse my French the full monty bog-standard amongst blow off he lost his bottle cup of tea ummm I'm telling he legged it bamboozled it's all gone to pot only a quid some dodgy chav twit blower say cup of char down the pub pear shaped brown bread quaint dropped a clanger owt to do with me Oxford give us a bell hunky-dory smashing spiffing good time the little rotter brolly bevvy on your bike mate codswallop cobblers cockup tickety-boo baking cakes gormless naff bog super lavatory lemon squeezy crikey wind up Charles squiffy bleeder bloke gosh up the duff matie boy it's your round blag I chimney pot Queen's English cuppa easy peasy lurgy show off show off pick your nose and blow off A bit of how's your father cack blatant bite your arm off bugger you mug at public school arse over tit spend a penny bubble and squeak fantastic Eaton tomfoolery hanky panky lost the plot bender my good sir young delinquent hotpot cracking goal well fanny around bits and bobs so I said porkies</p>
<p>Why I say old chap that is spiffing chinwag starkers posh grub mufty tosser excuse my French the full monty bog-standard amongst blow off he lost his bottle cup of tea ummm I'm telling he legged it bamboozled it's all gone to pot only a quid some dodgy chav twit blower say cup of char down the pub pear shaped brown bread quaint dropped a clanger owt to do with me Oxford give us a bell hunky-dory smashing spiffing good time the little rotter brolly bevvy on your bike mate codswallop cobblers cockup tickety-boo baking cakes gormless naff bog super lavatory lemon squeezy crikey wind up Charles squiffy bleeder bloke gosh up the duff matie boy it's your round blag I chimney pot Queen's English cuppa easy peasy lurgy show off show off pick your nose and blow off A bit of how's your father cack blatant bite your arm off bugger you mug at public school arse over tit spend a penny bubble and squeak fantastic Eaton tomfoolery hanky panky lost the plot bender my good sir young delinquent hotpot cracking goal well fanny around bits and bobs so I said porkies</p>
<p>Why I say old chap that is spiffing chinwag starkers posh grub mufty tosser excuse my French the full monty bog-standard amongst blow off he lost his bottle cup of tea ummm I'm telling he legged it bamboozled it's all gone to pot only a quid some dodgy chav twit blower say cup of char down the pub pear shaped brown bread quaint dropped a clanger owt to do with me Oxford give us a bell hunky-dory smashing spiffing good time the little rotter brolly bevvy on your bike mate codswallop cobblers cockup tickety-boo baking cakes gormless naff bog super lavatory lemon squeezy crikey wind up Charles squiffy bleeder bloke gosh up the duff matie boy it's your round blag I chimney pot Queen's English cuppa easy peasy lurgy show off show off pick your nose and blow off A bit of how's your father cack blatant bite your arm off bugger you mug at public school arse over tit spend a penny bubble and squeak fantastic Eaton tomfoolery hanky panky lost the plot bender my good sir young delinquent hotpot cracking goal well fanny around bits and bobs so I said porkies</p>
</div>
<div class="sidebar">
<div class="panel">
<h2>Heading</h2>
<p>Why I say old chap that is spiffing haggle fantastic gosh up the duff cheers tomfoolery tosser William brolly chip shop boot bog</p>
</div>
<div class="panel">
<h2>Heading</h2>
<p>Why I say old chap that is spiffing haggle fantastic gosh up the duff cheers tomfoolery tosser William brolly chip shop boot bog</p>
</div>
<div class="panel">
<h2>Heading</h2>
<p>Why I say old chap that is spiffing haggle fantastic gosh up the duff cheers tomfoolery tosser William brolly chip shop boot bog</p>
</div>
</div>
body {
background: #eee;
font-family: Arial;
}
.wrapper {
max-width: 80%;
margin: auto;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 10px;
}
.title {
grid-column-start: 1;
grid-column-end: 5;
}
.mainColumn {
grid-column-start: 1;
grid-column-end: 4;
}
.sidebar {
grid-column-start: 4;
grid-column-end: 5;
}
.mainColumn p, .mainColumn h1 {
margin: 10px;
line-height: 1.5;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.