I've placed a Nectar slider on my (home)page with some text. Want the heading to be 50px large, but at a browser-width (viewport) of 1264px the font falls back to 22px... Put this code in the custom salient-box:
/* Desktop greater then 1000px */
@media only screen
and (min-width : 1000px) {
body header#top #logo img {
height: 150px!important;
margin-top: -8px !important;
}
}
/* Desktop */
@media only screen
and (min-width : 1px) and (max-width : 1000px) {
body header#top #logo img {
height: 137px!important;
margin-top: -6px !important;
}
}
html body #header-outer {
border: none !important;
}
/* iPad */
@media only screen and (min-device-width: 481px) and (max-device-width: 1025px) {
body header#top #logo img {
height: 54px!important;
margin-top: -12px;
}
}
/* iPad landscape */
@media only screen and (min-device-width: 481px) and (max-device-width: 1025px) and (orientation:landscape) {
I've placed a Nectar slider on my (home)page with some text. Want the heading to be 50px large, but at a browser-width (viewport) of 1264px the font falls back to 22px... Put this code in the custom salient-box:
/* Desktop greater then 1000px */
@media only screen
and (min-width : 1000px) {
body header#top #logo img {
height: 150px!important;
margin-top: -8px !important;
}
}
/* Desktop */
@media only screen
and (min-width : 1px) and (max-width : 1000px) {
body header#top #logo img {
height: 137px!important;
margin-top: -6px !important;
}
}
html body #header-outer {
border: none !important;
}
/* iPad */
@media only screen and (min-device-width: 481px) and (max-device-width: 1025px) {
body header#top #logo img {
height: 54px!important;
margin-top: -12px;
}
}
/* iPad landscape */
@media only screen and (min-device-width: 481px) and (max-device-width: 1025px) and (orientation:landscape) {
body header#top #logo img {
height: 54px!important;
margin-top: -12px !important;
}
}
/* Mobile */
@media only screen and (max-width: 470px) {
body header#top #logo img {
height: 54px!important;
margin-top: -12px;
}
}
Hey Wim!
You need to place the font-size css property in the media query as well. Please provide the site url so i can provide working css.
Thanks
ThemeNectar Support Team
Hi Tahit, url is: www.bwkpartners.com
Thanks in advance!
Wim
Hey Wim!
@media only screen and (min-width : 690px) and (max-width :1000px) { body .nectar-slider-wrap[data-full-width="true"] .swiper-slide .content h2,.nectar-slider-wrap[data-full-width="boxed-full-width"] .swiper-slide .content h2,.full-width-content .vc_span12 .swiper-slide .content h2 { font-size:31px!important; line-height: 24px!important; } body .nectar-slider-wrap[data-full-width="true"] .swiper-slide .content p,.nectar-slider-wrap[data-full-width="boxed-full-width"] .swiper-slide .content p,.full-width-content .vc_span12 .swiper-slide .content p { font-size: 9.9px!important; line-height: 18px!important; } }
ThemeNectar Support Team
Thanks Tahir!
Wim