html{ margin:0px; padding:0px; height:100vh; } body { display:grid; min-height:100vh; max-width:80%; margin:auto; font-family: Helvetica, Arial,sans-serif; font-size:1rem; height:100%; margin-bottom:0px; grid-template-columns : 2fr 1fr; grid-template-rows : auto 1fr auto; /* align-items:stretch;*/ } header { grid-column: 1 / span 2; } section h2{ flex-basis:100%; text-align:center; } h2.titre { text-align:center; background-color: #eeeeee; padding:1rem; margin-top:2rem; margin-bottom:2rem; } nav { margin:3rem; margin-bottom:3.5rem; } nav ul { list-style-type: none; padding : 5px; text-align:center; font-size:1.2rem; display:flex; justify-content:center; } nav ul li { margin-left :1rem ; margin-right:1rem; } footer a,nav ul a { color: #3B81BE; text-decoration:none; border-bottom: 1px dashed #666666; } em{ font-weight:bold; } .informaticien article { flex:1 40%; padding:1em; border : 1px solid #eeeeee; margin : 5px; text-align:left; } .informaticien article img { float :right; width : 125px; height:125px; padding:10px; box-shadow: 10px 10px 5px #656565; } .date { font-size : 1rem; } section.informaticien { display:flex; justify-content:space-around; flex-wrap:wrap; align-self:stretch; grid-column : 1 ; } aside { padding-left:1.5rem; border-left : 1px solid #eeeeee; margin:0px; grid-column : 2; /*align-self:center;*/ } aside p { font-size:0.9rem; text-align:justify; } aside p::before { content:">>"; color: #3B81BE; } footer { grid-column : span 2; padding-top:10px; border-top:1px solid #eeeeee; margin:0px; display:flex; justify-content:space-between; }