Not Responsive

[GleanCoder]

hello @zahoorshinwari your website is responsive , it start overflow after 786px , can you assign me this I want to fix it?

[zahoorshinwari]

Ok
Change it.

[Yogesh-160]

Use this CSS property :

@media only screen and (max-width: 600px) {
body {
}
}

Or check out my portfolio which is responsive on both mobile as well as in laptop screens.
I used this code to make it responsive

@media(max-width: 768px){
#menu-icon{
display: block;
}
.navbar{
position: absolute;
top: 100%;
left: 0;
width: 100%;
padding: 1rem 3%;
background:var(--bg-color);
border-top: .1rem solid rgba(0,0,0,.2);
box-shadow: 0 .5rem 1rem rgba(0,0,0,.2);
display: none;
}

.navbar.active{
    display: block;
}

.navbar a{
    display: block;
    font-size: 2rem ;
    margin: 3rem 0;
}

.home{
    flex-direction: column;
}

.home-content h3{
    font-size: 2.6rem;
}

.home-content h1{
    font-size: 5rem;
}

.home-img img{
    width: 70vw;
    margin-top: 4rem;
}

.about {
    flex-direction: column-reverse;
}

.about-img{
    width: 35vw;
    margin-top: 4rem;
    margin-left: 50px;
}


.portfolio h2{
    margin-bottom: 3rem;
}

.portfolio-container{
    grid-template-columns: repeat(2,1fr);
}

.certificates h2{
    margin-bottom: 3rem;
}

.certificates-container{
    grid-template-columns: repeat(2,1fr);
}

}
@media (max-width: 617px){

.portfolio-container{
    grid-template-columns: 1fr;
}

.certificates-container{
    grid-template-columns: 1fr;
}

}

Click this link to check out my Portfolio #1: https://github.com/Yogesh-160/Portfolio_Yogesh_Jha/tree/main

Portfolio #2: https://github.com/Yogesh-160/Portfolio

Give ⭐️ if my code is helpful for you.

[GleanCoder]

@Yogesh-160 Ok I will you Inform you after checking the code.

[zahoorshinwari]

okay .