سلام ببخشید این کد ها روی مروگر در حالت ریسپانسیو اجرا میشه ولی توی موبایل ران نمیشه
@media screen and ((min-width: 274px) and (max-width: 304px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1rem;
}
#imgbaner1 {
width: 15rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-top: -10.37rem;
border-radius: 6px;
width: 7.5rem;
height: 190px;
}
#imgbaner3 {
width: 110px;
height: 190px;
margin-top: -166px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
#div {
width: 14rem;
height: 5rem;
}
#hbelog {
font-size: 1.5rem;
margin-right: -190px;
margin-top: 26px;
color: #000;
margin-left: 28px;
}
#hurl {
display: contents;
}
#aurl {
display: none;
}
#div-1 {
width: 14rem;
height: 5rem;
margin-top: 91px
}
#aurl-1 {
display: none;
}
#hbelog-1 {
font-size: 1.5rem;
margin-right: 44px;
margin-top: 26px;
color: #000;
}
#hurl-1 {
display: contents;
}
}
@media screen and ((min-width: 305px ) and (max-width: 360px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1rem;
}
#imgbaner1 {
width: 18rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 8.5rem;
height: 190px;
}
#imgbaner3 {
width: 7.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
#div {
width: 15rem;
height: 5rem;
}
#hbelog {
font-size: 1.5rem;
margin-right: -190px;
margin-top: 26px;
color: #000;
margin-left: 31px;
}
#hurl {
display: contents;
}
#aurl {
display: none;
}
#div-1 {
width: 15rem;
height: 5rem;
margin-top: 91px
}
#aurl-1 {
display: none;
}
#hbelog-1 {
font-size: 1.5rem;
margin-right: 9px;
margin-top: 26px;
color: #000;
}
#hurl-1 {
display: contents;
}
}
@media screen and ((min-width: 360px) and (max-width: 370px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1rem;
}
#imgbaner1 {
width: 19rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 9.5rem;
height: 190px;
}
#imgbaner3 {
width: 7.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
@media screen and ((min-width: 370px) and (max-width: 390px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1.3rem;
}
#imgbaner1 {
width: 20rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 9.5rem;
height: 190px;
}
#imgbaner3 {
width: 8.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
@media screen and ((min-width: 390px) and (max-width: 400px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1.3rem;
}
#imgbaner1 {
width: 21rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 10.5rem;
height: 190px;
}
#imgbaner3 {
width: 8.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
@media screen and ((min-width: 400px) and (max-width: 410px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1.3rem;
}
#imgbaner1 {
width: 22rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 11.5rem;
height: 190px;
}
#imgbaner3 {
width: 8.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
@media screen and ((min-width: 410px) and (max-width: 420px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1.3rem;
}
#imgbaner1 {
width: 23rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 11.5rem;
height: 190px;
}
#imgbaner3 {
width: 9.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
@media screen and ((min-width: 420px) and (max-width: 430px)) {
#logoimg {
width: 0rem;
}
.matnr {
font-size: 1.3rem;
}
#imgbaner1 {
width: 23rem;
height: 6.06rem;
border-radius: 6px;
}
#imgbaner2 {
margin-left: 17px;
margin-top: -10.37rem;
border-radius: 6px;
width: 11.5rem;
height: 190px;
}
#imgbaner3 {
width: 9.87rem;
height: 190px;
margin-top: -166px;
margin-right: 17px;
border-radius: 6px ;
}
#twobaner {
margin: 0px;
display: flex;
justify-content: space-around;
}
}
سلام خوبی به این صورت بنویس
@media screen and (max-width: 900px) and (min-width: 500px) {
.box {
font-size: 50px;
padding: 50px;
}
}
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟