Support » Fixing WordPress » How to use wp_is_moobile function

  • Resolved jelo_inc

    (@jelo_inc)


    Hi, i’m new using word press, and i have been doing my own web site, but the problem is that an image goes in a certain way on mobile site, and when you are in desktop way looks bad. so i want to use the function in the style.css to be able to add margin on desktop and on mobile eliminate the margin, but i can not find the way how to use it.

    this is the original.

    .adsng-cover img {
    margin-left: -30px;
    margin-bottom: 40px;
    width: 310px;
    height: 310px;
    }

    this is the one i edited from the original. this control the aspect of the image. And i want to have different values on mobile and on desktop (basically the margin). i saw the function on the web but i don’t know how to use it.

    .adsng-cover img {

    if ( wp_is_mobile() ) {

    margin-left: -30px;
    margin-bottom: 40px;
    width: 310px;
    height: 310px;

    } else {

    margin-left: 0px;
    margin-bottom: 40px;
    width: 310px;
    height: 310px;

    }

    Can someone help Me?
    Kind Regards.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Jon (Kenshino)

    (@kenshino)

    Lord Jon

    wp_is_mobile() is a PHP function.

    What you need for CSS is Media Queries.

    See http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

    Thread Starter jelo_inc

    (@jelo_inc)

    Thanks, thanks bro, i’ve made it, i created two different queries.

    @media only screen and (max-width:480px) {
    .adsng-cover img {
    margin-left: -30px;
    margin-bottom: 40px;
    width: 310px;
    height: 310px;
    }
    }
    
    @media only screen and (min-width:480px) {
    .adsng-cover img {
    margin-left: 0px;
    margin-bottom: 40px;
    width: 310px;
    height: 310px;
    }
    }

    So many thanks.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to use wp_is_moobile function’ is closed to new replies.