@besttlookk
Posted
Hi, Tho its simple still people stuggle to do it. If you look the solution of others they look different that what was in the design. Yours look nice . My only suggestion would be to get rid of srcolling and to center the box w.r.t screen.
Good Luck #happyCoding
@priyankavasam7
Posted
@besttlookk Hello, Thanks! Yea I observed that scrolling thing. I have tired to get rid of it but I'm just unable to do it I have tried setting viewport also I don't really understand what's wrong with it. I could also see some accessibility issues with my code about landmark, even when everything is right. These two things are really bothering me a lot. It would be really very helpful if you could help me in figuring this issue out 😊
@besttlookk
Posted
@priyankavasam7 Have you tried overflow:hidden ?
body{
min-height:100vh;
overflow:hidden;
}
I usually do "overflow-x:hidden" . But here we even dont want scrolling in y-direction. so "overflow:hidden"
Do let me know if it worked(it should) or not.
Tho i am not an expert but I will look into your accessibility issue.
;)
Marked as helpful
@besttlookk
Posted
@priyankavasam7 About accessibility issue: Try using semantic HTML element . Like you are making a header. Rather than using a <div> to wrap the content use <header> tag. same goes for <footer>.
If there are nav links. Wrap them in <nav>
Most importantly(and i think it applies to your solution) wrap the main content inside <main></main>
If there are different sections in your page. divide them in <section> tag.
here is the link if you wanna know more: https://www.w3schools.com/html/html5_semantic_elements.asp
Good luck, #happyCoding
Marked as helpful
@priyankavasam7
Posted
@besttlookk Thankyou! It is working, I will implement this from now on :))
@besttlookk
Posted
@priyankavasam7 Keep coding and keep learning. Happy to help. :)
