This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Shrink circle icons for mobile website

Resolved 3 replies premiumthemetheme-vantage
Trevor Wolfe
11 years ago · Last reply by Andrew Misplon 11 years ago

Is there any way to make the circle icons shrink down for the mobile website so they stay horizontal rather than align vertically.

Here is my website: http://www.technowolf.com/

In my footer I have for circle icons and I would like them to shrink down and stay aligned horizontally when on the mobile website.

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Andrew Misplon Staff 11 years, 9 months ago

    HI Trevor

    The current setup is pretty safe in that it works in a predictable manner. You can try the following under Appearance > Custom CSS:

    /* Footer Widgets Circle Icon Mobile */
@media screen and (max-width: 680px) {
body.responsive #footer-widgets .widget {
float: left !important;
width: 25%;
}
}

    We can assist with the odd, quick, CSS snippet but if you need elements tweaked further than that we suggest getting the help of a developer.

  2. Trevor Wolfe 11 years, 9 months ago

    Okay that worked well, but now the text under the circle icons is aligned vertically. Is there any way to just hide the text for mobile?

  3. Andrew Misplon Staff 11 years, 9 months ago

    Something like this:

    /* Footer Widgets Circle Icon Mobile */
@media screen and (max-width: 680px) {
body.responsive #footer-widgets .widget {
float: left !important;
width: 25%;
}
.widget_circleicon-widget .circle-icon-box h4 { display: none !important; }
}

    Our CSS tutorial is here: https://siteorigin.com/basics/modifying-theme-design-with-custom-css/.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread