Get resolution width in theme on init

  • francescjp

    (@francescjp)


    5 years, 10 months ago

    Hello:

    I am creating a custom child theme where I display several divs containing information. Each div is displayed one followed by the other in order to display them in a responsive way.
    Depending on screen width there are less or more div lines.

    I need to control certain width resolutions because in big screen you can find first line with 5 divs and second with only one,
    I need to adapt this case with near same divs number in each line.

    I think the best way is to get the resolution width when I create the divs using wordpress functions.

    Anyone knows the way to do it?

    Thank you

Viewing 5 replies - 1 through 5 (of 5 total)
  • Joy

    (@joyously)

    5 years, 10 months ago

    It’s better to have the PHP always output the same and the CSS or JS account for the width since they act on the client device.
    Have you heard of CSS media queries? https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Media_queries

    Thread Starter francescjp

    (@francescjp)

    5 years, 9 months ago

    Hello Joy:

    Yes, I’ve heared about it. How can I rorder divs in new lines using javascript?
    Thank you very uch for your help Joy.

    Francescjp

    Joy

    (@joyously)

    5 years, 9 months ago

    I think that is a vague question, and the whole concept of re-ordering divs is not accessible.
    Media queries is still my advice.

    Thread Starter francescjp

    (@francescjp)

    5 years, 9 months ago

    With css I don’t see how to reorder divs.
    Thank you Joy for your help.

    Joy

    (@joyously)

    5 years, 9 months ago

    Think of what is best for the user. Is the order of the content dependent on the size of the window? I would hope not, because someone using a screen reader will have trouble finding their way if they turn their phone.
    There is CSS called Flex and Grid that allow you to reorder things, but it is not advisable for accessibility reasons.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Get resolution width in theme on init’ is closed to new replies.