I struggled to begin with implementing the main background-color as i thought the Main element would auto resize the the max-width of the widest child and couldn't think why I had so much whitespace when I changed the background-color to white... Yeah my brain was running slow, so I put everything inside a container and messed with the margins which corrected that for me.
Hello, for background desktop : I did this and it worked: Html :
<div class="background-desktop"> <svg xmlns="http://www.w3.org/2000/svg" width="1440" height="437"><path fill="#D6E1FF" fill-rule="evenodd" d="M0 349.974c218.558 116.035 460.05 116.035 724.475 0s502.933-116.035 715.525 0V0H0v349.974z"/></svg> </div> CSS : .background-desktop{ position: absolute; display: block; padding-top: 30%; width: 100vw; margin-top: 0;} .background-desktop svg{ margin-top: 0; width: 100%; display: block; }
