[resolved] Issues with mobile design (4 posts)

  1. Beee
    Posted 3 years ago #

    I ran into something I'm not sure is a bug or too few css knowledge on my side :)

    On http://www.freerides.org I use the plugin on the frontpage.
    When watching the site on a screen which is max 480 pixels wide, the pagination 'breaks'.

    I made a screenshot of how the site looks on a 480 and 320 screen.
    See http://i.imgur.com/AowQQVA.png


  2. Lester Chan
    Plugin Author

    Posted 3 years ago #

    I don't think this is a bug, more like a css glitch which happens to my site as well. For my site, once it is down to a smaller screen, I basically hide wp-pagenavi and switch to a next/prev link instead. You can see it here http://lesterchan.net/

  3. Beee
    Posted 3 years ago #

    That was my alternative option as well, but didn't want to...
    I'ld rather fix the issue. Couldn't this be fixed by changing the spans into divs ?

  4. Beee
    Posted 3 years ago #

    I tried it out myself and the answer is yes it does, for me it seems to be working, with some alterations to your code.

    step 1.
    change all spans to divs in core.php

    step 2.
    change line 174 of core.php

    $out = $before . "<div class='wp-pagenavi'>\n$out\n</div>" . $after;


    $out = $before . "<div class='wp-pagenavi'>\n$out\n</div><div class='clear'></div>" . $after;

    so the rest after won't float.

    step 3.
    add "float: left;" to .wp-pagenavi a, .wp-pagenavi div {

    step 4.
    add ".clear { clear: both; }"

    That worked for me.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic