‘’‘https://github.com/keshavgoyal2807/mdn-css’’’.
‘’’ while using box-sizing:border -box the nav is moving to right corner but if we not set and by default box-sizing:content-box then the nav is moving to the down of aside. why the height is not changing when it is border box I am not able to get this thing please help me to understand this topic and any suggestions on the assessment are welcomed.’’’
Hi @keshavgoyal2014 — this is because with box-sizing: border-box
applied, all block level elements are in effect narrower than they would be with the default box-sizing: content-box
, so they all fit onto one line of the layout.
Without box-sizing: border-box
applied, the boxes are too wide to all fit on one line, so the navigation is pushed down onto another line.
Read https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Box_model#Active_learning_playing_with_boxes for an explanation of why.
‘’’ THANKS CHRIS YOUE EXPLANATION WAS REALLY HELPFUL AND CAN YOU SUGGEST ANY WAYS TO PRACTICE CSS MORE SO THAT THE CONCEPTS ARE MORE CLEAR AND EASY TO USE THEM AFTERWARDS OR ANY PROJECTS SO THAT I CAN IMPLEMENT ON IT’’’