2021-08-25, 03:26 PM
hey here is my page that i was creating for my memblist page and this a starting test page.
https://storyworlds.in/testpage.php
nad the css i was applied there isย
but in mobile version the cards calss isn't working as width 100%.
did i do something wrong in the css or html ?๐ค
https://storyworlds.in/testpage.php
nad the css i was applied there isย
.members_list {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
width: 100%;
}
.cards {
position: relative;
height: 200px;
width: 45%;
margin: 5px;
background: #15c3d6;
box-shadow: 0 50px 50px rgba(0, 0, 0, 0.2);
padding: 10px;
border-radius: 6px;
}
.cards .detail {
display: flex;
align-items: center;
}
.cards .detail .imgbox {
position: relative;
height: 60px;
width: 60px;
border-radius: 50%;
overflow: hidden;
margin-top: -8px;
}
.cards .detail .imgbox img{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
object-fit: cover;
}
.cards .detail h2 {
font-size: 21px;
font-weight: bold;
margin-left: 12px;
}
.cards .detail h2 .users_title {
display: block;
font-weight: 400;
font-size: 12px;
}
@media only screen and (max-width: 768px) {
.cards {
width: 100% !important:
}
}
but in mobile version the cards calss isn't working as width 100%.
did i do something wrong in the css or html ?๐ค