Question: hello, can you make this responsive? Can you make it looks virtually the same while being unaffected by resizing the browser? Also can you make
hello, can you make this responsive? Can you make it looks virtually the same while being unaffected by resizing the browser? Also can you make the image responsive as well? Thanks ! Will thumbs up!
code:
About page
About me
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ullamcorper, magna porttitor interdum maximus, purus nibh venenatis est, in porttitor elit purus quis augue. Sed quam ante, sollicitudin eget sapien sagittis, tincidunt pretium mi. Nulla ac nisl eget massa sagittis dictum nec at neque. Maecenas eget leo vel orci vulputate pulvinar. Nam vestibulum sit amet est eu fermentum. Mauris vitae eleifend mi. Integer dapibus gravida libero sed varius. Donec consequat scelerisque tincidunt. Etiam nisl lacus, tristique ac leo nec, elementum pulvinar nisl. Donec sed leo condimentum, pharetra ligula eget, elementum mauris. Donec augue enim, blandit vel suscipit quis, tempor id tortor. Aliquam sit amet commodo est. Fusce ac malesuada diam. Phasellus dignissim leo eget malesuada rhoncus.
#about{
width:100%;
height: 100vh;
background-color:#010b0a;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
padding: 50px 5% 0px 5%;
position: relative;
}
@media(max-width:970px){
.about-model{
display: none;
}
#about{
justify-content: center;
padding-top: 0px;
}
.about-text{
width: 90%;
}
.about-text h1{
font-size:4rem;
}
.p-container{
width:100%;
}
}
.about-text{
font-family: calibri;
width: 50%;
}
.about-text h1{
font-size: 5rem;
color:#0ee4cc;
}
.about-text h2{
font-size: 3rem;
color:#FFFFFF;
font-weight: 400;
}
.about-text h1,h2{
margin: 0px;
padding: 0px;
}
.about-text p{
font-size: 1.2rem;
color:rgba(255,255,255,0.90);
}
.about-text button{
width: 180px;
height: 40px;
border-radius: 20px;
border: none;
outline: none;
background-color:#0ee4cc;
}
.about-text button:hover{
background-color: #FFFFFF;
transition: all ease 0.3s;
}
.about-text{
font-family: calibri;
width: 50%;
}
.about-text h1{
font-size: 5rem;
color:#0ee4cc;
}
.about-text h2{
font-size: 3rem;
color:#FFFFFF;
font-weight: 400;
}
.about-text h1,h2{
margin: 0px;
padding: 0px;
}
.about-text p{
font-size: 1.2rem;
color:rgba(255,255,255,0.90);
}
.about-text button{
width: 180px;
height: 40px;
border-radius: 20px;
border: none;
outline: none;
background-color:#0ee4cc;
}
.about-text button:hover{
background-color: #FFFFFF;
transition: all ease 0.3s;
}
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
Study Help