Some CSS code not working.

Some of the CSS for my website is not working. Most lines are working but a few do not. is there anything wrong with these sections:


@media only screen and (max-width : 1132px) and (min-width : 1024px){
body .nectar-slider-wrap div.swiper-slide .content h2 {
font-size: 20px!important;
color: #AEA2B0
line-height: 22px!important;
margin-bottom: 2px;
letter-spacing: -0.5px;
}

body .nectar-slider-wrap div.swiper-slide .content p span {
font-size: 15px!important;
line-height: 20px!important;
padding-bottom: 7px;
}
body .nectar-slider-wrap div.swiper-slide .content p {
font-size: 15px!important;
line-height: 20px!important;
padding-bottom: 7px;
}
body .nectar-slider-wrap div.swiper-slide .button a {
font-size: 14px!important;
padding: 14px 14px !important;
font-style: bold; !important;
border: 2px solid #AEA2B0;
border-radius: 5px 5px 5px 5px !important;
}

body .nectar-slider-wrap .swiper-slide .content {
bottom: -130%;
margin-left: -2% !important;
}

The second to last line (bottom: -130%:wink: doesn’t work.


@media only screen and (max-width : 735px) and (min-width : 1px){
body .nectar-slider-wrap div.swiper-slide .content h2 {
font-size: 20px!important;
color: #AEA2B0
line-height: 22px!important;
margin-bottom: 2px;
letter-spacing: -0.5px;
}

body .nectar-slider-wrap div.swiper-slide .content p span {
font-size: 15px!important;
line-height: 20px!important;
padding-bottom: 7px;
}
body .nectar-slider-wrap div.swiper-slide .content p {
font-size: 15px!important;
line-height: 20px!important;
padding-bottom: 7px;
}
body .nectar-slider-wrap div.swiper-slide .button a {
font-size: 5px!important;
padding: 5px 5px !important;
font-style: bold; !important;
border: 5px solid #AEA2B0;
border-radius: 5px 5px 5px 5px !important;
}

body .nectar-slider-wrap .swiper-slide .content {
margin-left: -140px !important;
top: 230px !important;
}
}

This portion of ths above code does not seem to work:

body .nectar-slider-wrap div.swiper-slide .button a {

font-size: 5px!important;

padding: 5px 5px !important;

font-style: bold; !important;

border: 5px solid #AEA2B0;

border-radius: 5px 5px 5px 5px !important;

}

Thanks in advance.

Dion

  • Nahid
    • Tech Support

    Hey Dion Kara !

    Hope you are having a great day!

    Well, I can’t really help you properly until you mention what you want to do with the code specifically. From my observation of the provided code, here are some suggestions.

    @media only screen and (max-width : 1132px) and (min-width : 1024px){
    body .nectar-slider-wrap div.swiper-slide .content h2 {
    font-size: 20px!important;
    color: #AEA2B0
    line-height: 22px!important;
    margin-bottom: 2px;
    letter-spacing: -0.5px;
    }

    body .nectar-slider-wrap div.swiper-slide .content p span {
    font-size: 15px!important;
    line-height: 20px!important;
    padding-bottom: 7px;
    }
    body .nectar-slider-wrap div.swiper-slide .content p {
    font-size: 15px!important;
    line-height: 20px!important;
    padding-bottom: 7px;
    }
    body .nectar-slider-wrap div.swiper-slide .button a {
    font-size: 14px!important;
    padding: 14px 14px !important;
    font-style: bold; !important;
    border: 2px solid #AEA2B0;
    border-radius: 5px 5px 5px 5px !important;
    }

    body .nectar-slider-wrap .swiper-slide .content {
    bottom: -130%;
    margin-left: -2% !important;
    }

    This bunch of code doesn’t seem to have a closing bracket. Try replacing it with the following:

    @media only screen and (max-width : 1132px) and (min-width : 1024px){
    body .nectar-slider-wrap div.swiper-slide .content h2 {
    font-size: 20px!important;
    color: #AEA2B0
    line-height: 22px!important;
    margin-bottom: 2px;
    letter-spacing: -0.5px;
    }

    body .nectar-slider-wrap div.swiper-slide .content p span {
    font-size: 15px!important;
    line-height: 20px!important;
    padding-bottom: 7px;
    }
    body .nectar-slider-wrap div.swiper-slide .content p {
    font-size: 15px!important;
    line-height: 20px!important;
    padding-bottom: 7px;
    }
    body .nectar-slider-wrap div.swiper-slide .button a {
    font-size: 14px!important;
    padding: 14px 14px !important;
    font-style: bold; !important;
    border: 2px solid #AEA2B0;
    border-radius: 5px 5px 5px 5px !important;
    }

    body .nectar-slider-wrap .swiper-slide .content {
    bottom: -130%;
    margin-left: -2% !important;
    }
    }

    body .nectar-slider-wrap div.swiper-slide .button a {
    font-size: 5px!important;
    padding: 5px 5px !important;
    font-style: bold; !important;
    border: 5px solid #AEA2B0;
    border-radius: 5px 5px 5px 5px !important;
    }

    This chunk of codes has some issues too. Try replacing it with the following:

    body .nectar-slider-wrap div.swiper-slide .button a {
    font-size: 5px !important;
    padding: 5px 5px !important;
    font-style: bold !important;
    border: 5px solid #AEA2B0;
    border-radius: 5px 5px 5px 5px !important;
    }

    Let me know if this works. Thanks!

    Best,

    Nahid.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.