Well, I’ve added so much of CSS which I’m not even sure of, So I’ve deleted one and checked the same… until I found where the problem code was and tried to remove it but then my site in desktop view has so much space between the title and content. now it looks ok I’m fine with it after tweaking around and entering new CSS from someplace else. ill post it below, You can go through with it.
aside.widget-area {
margin-top: -100px;
}
.custom-logo-link {
display: inline-block;
float: left;
}
.site-header {
padding-top: 20px;
}
#masthead {
padding: ;
}
#masthead {
padding-bottom: 12px !important;
}
The first CSS was for reducing empty spaces in the footer widget area.
The second CSS was for the logo moving it upwards toward the top screen( i think)
The third CSS was where the problem has been identified, If I put ‘zero’ in below CSS
then my mobile view gets screwed up. so I removed zero from it. #masthead {
padding: 0;
}
The fourth one did the trick. well everything was needed for my website to look ok.