Journal

<meta charset="utf-8" /><link href="stylej.css" rel="stylesheet" /><title>Journal</title>
<div class="journal">
   <div class="jheader"><img src="http://i19.servimg.com/u/f19/11/31/48/21/journa10.png"/></div>
   <div class="jleft">
      <div class="h2journal">Météo</div>
      <div class="pjournall"> Quisque varius eu elit ac convallis. Mauris cursus metus nec erat imperdiet varius. Praesent gravida turpis vel fermentum posuere. Duis tortor elit, tempus a rutrum a, imperdiet eget ex. Suspendisse quam tellus, condimentum ut vehicula efficitur, volutpat eu nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam augue elit, accumsan id felis at, pretium gravida ante. Phasellus eget ligula quis diam hendrerit tempor at sed eros. Vestibulum sed enim ornare leo auctor lobortis. Sed non dolor volutpat, lobortis sem sed, bibendum enim. Mauris congue quam eros.
      </div>
      <br/>
      <br/>
      <div class="h2journal">Bienvenue</div>
      <div class="pjournall">Bienvenue à xx notre nouvel habitant de Londres!...... ........... ...........
      </div>
   </div>
   <div class="jright">
      <div class="h1journal">Cette semaine à Londres</div>
      <div class="pjournal">Quisque varius eu elit ac convallis. Mauris cursus metus nec erat imperdiet varius. Praesent gravida turpis vel fermentum posuere. Duis tortor elit, tempus a rutrum a, imperdiet eget ex. Suspendisse quam tellus, condimentum ut vehicula efficitur, volutpat eu nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam augue elit, accumsan id felis at, pretium gravida ante. Phasellus eget ligula quis diam hendrerit tempor at sed eros. Vestibulum sed enim ornare leo auctor lobortis. Sed non dolor volutpat, lobortis sem sed, bibendum enim. Mauris congue quam eros. <br /><br />  Quisque varius eu elit ac convallis. Mauris cursus metus nec erat imperdiet varius. Praesent gravida turpis vel fermentum posuere. Duis tortor elit, tempus a rutrum a, imperdiet eget ex. Suspendisse quam tellus, condimentum ut vehicula efficitur, volutpat eu nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam augue elit, accumsan id felis at, pretium gravida ante. Phasellus eget ligula quis diam hendrerit tempor at sed eros. Vestibulum sed enim ornare leo auctor lobortis. Sed non dolor volutpat, lobortis sem sed, bibendum enim. Mauris congue quam eros.<br /><br />  Quisque varius eu elit ac convallis. Mauris cursus metus nec erat imperdiet varius. Praesent gravida turpis vel fermentum posuere. Duis tortor elit, tempus a rutrum a, imperdiet eget ex. Suspendisse quam tellus, condimentum ut vehicula efficitur, volutpat eu nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam augue elit, accumsan id felis at, pretium gravida ante. Phasellus eget ligula quis diam hendrerit tempor at sed eros. Vestibulum sed enim ornare leo auctor lobortis. Sed non dolor volutpat, lobortis sem sed, bibendum enim. Mauris congue quam eros.<br /><br />
      </div>
   </div>
</div>

.journal{
width:80%;
max-width:750px;
height:600px;
background-color:white;
border: 1px solid black;
padding-bottom:10px;
margin-left: auto;
margin-right: auto;
}

.jheader{
width:100%;
max-width:700px;
display: block;
margin-right:auto;
margin-left: auto;
}

.jheader img{
width:700px;
height:250px;
max-width:100%;
max-height:100%;
display:block;
}

.jleft{
width:30%;
height:70%;
max-height:350px;
overflow: auto;
display: inline-block;
float:left;
}

.jright{
width:69%;
height:70%;
max-height: 350px;
overflow:auto;
display: inline-block;
float: right;
border-left: 1px solid black;
}

.h1journal{
font-weight: bold;
font-family: century, cambria, times new roman, sans-serif;
font-size: x-large;
text-align: center;
display: block;
margin-top:-5px;
background-color:white !important;
}

.h2journal{
font-weight: bold;
font-family: century, cambria, times new roman, sans-serif;
font-size: large;
text-align: center;
margin-top: -1px;
margin-bottom:2px;
z-index:5;
}

.pjournal{
text-align: justify !important;
font-family: times new roman, sans-serif;
max-height:87%;
overflow:auto;
padding:10px;
display: inline-block;
}

.pjournall{
text-align: justify !important;
font-family: times new roman, sans-serif;
max-height:150px;
overflow:auto;
padding:10px;
display: inline-block;
}