-
Posts
-
I have a header widget which I’m trying to have display on desktop only. I have the css to try and accomplish this but it is still displaying and the margin around this widget is distorting the mobile layout here: http://unisourceprinting.com/
Here is css (I know it’s silly to remove h2 and h3 in widget that’s not supposed to be displaying – but it was messing up the whole header):
@media only screen and (min-width: 1000px) {
#header .widget {
left: 45%;
padding-top: 36px;
position: absolute;
top: 0;
}
#header .widget h3 {
font-family: “Droid Serif”, Georgia, Times, serif; font-style:italic;
}
}
/* mobile styles */
@media only screen and (max-width: 999px) {
#header .text-widget {
display: none !important;
}
#header .widget h3 {
display: none !important;
}
#header .widget h2 {
display: none !important;
}
}Hey ckwellington,
Please try this instead:
@media only screen and (max-width: 999px) { #text-15 { display:none; } }Best regards,
Rikard
- The topic ‘Header widget displaying on mobile devices’ is closed to new replies.