Hauteur de section <aside> dynamique
Bonjour
Je prépare un site avec un header, une section principale (<main>) et une section <aside>.
Je souhaiterai que ma section <aside> prenne la hauteur du contenu de la page (à savoir la hauteur du header+main).
Si cette hauteur est plus petite que le contenu de <aside>, alors une scrollbar apparaît.
Pour l'apparition de la scrollbar, pas de soucis.
Pour récupérer en Jquery la valeur totale de header+main, pas de soucis
J'ai un problème pour appliquer cette valeur à mon élément <aside>
Voici mon code (qui ne fonctionne pas du coup ;) ) :
Code:
1 2 3 4 5 6 7 8 9 10 11
| <script>
$(document).ready(function(){
var header = $('header').height();
var main = $('main').height();
var total = header + main + 'px';
console.log(total);
$('aside').css({"height": 'total'});
});
</script> |
C'est surement le ".css" qui ne fonctionne pas, mais je n'arrive à savoir pourquoi.
Merci beaucoup par avance pour votre aide !