Title: Responsive layout
Last modified: August 30, 2016

---

# Responsive layout

 *  [mathkn](https://wordpress.org/support/users/mathkn/)
 * (@mathkn)
 * [10 years, 7 months ago](https://wordpress.org/support/topic/responsive-layout-18/)
 * Hi,
    Im using Metaphor Members with WordPress V 4.3.1 and it looks great when
   I am on a computer, but when I change to mobile(responsive) view with a smaller
   screen it doesn’t look good. The image and name is all good, but the email an
   number gets blended togheter with other members.
 * Does anybody have fix for it? How can I edit the css to make the info responsive
   as well?
 * Screenshot:
    [http://tinypic.com/view.php?pic=530oxx&s=9](http://tinypic.com/view.php?pic=530oxx&s=9)
 * [https://wordpress.org/plugins/mtphr-members/](https://wordpress.org/plugins/mtphr-members/)

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

 *  Plugin Author [metaphorcreations](https://wordpress.org/support/users/metaphorcreations/)
 * (@metaphorcreations)
 * [10 years, 7 months ago](https://wordpress.org/support/topic/responsive-layout-18/#post-6762950)
 * Can you provide a link to your site so I can check it out in my developer tools?
 * Thanks!
 *  Thread Starter [mathkn](https://wordpress.org/support/users/mathkn/)
 * (@mathkn)
 * [10 years, 7 months ago](https://wordpress.org/support/topic/responsive-layout-18/#post-6762965)
 * The picture I sent was from a test site, but I have implemented it to a site 
   already.
    There are several sites with the plugin, and its the same problem with
   all of them.
 * [http://www.sana.as/hovedkontor/](http://www.sana.as/hovedkontor/)
    [http://www.sana.as/birkeland/](http://www.sana.as/birkeland/)
   [http://www.sana.as/lillesand/](http://www.sana.as/lillesand/) [http://www.sana.as/lund/](http://www.sana.as/lund/)
 * If you minimize the window to a smartphone size, the user information is overlapping.
   The best thing would probably be to list them vertical downwards when the screen
   size is f.ex 500px and less.
 * Do you think that is possible?
 *  Plugin Author [metaphorcreations](https://wordpress.org/support/users/metaphorcreations/)
 * (@metaphorcreations)
 * [10 years, 7 months ago](https://wordpress.org/support/topic/responsive-layout-18/#post-6762998)
 * Thanks for the info. This plugin was built mainly with the intention to be incorporated
   with themes that provide their own styling for the different displays… So, there
   are very few styles added to the plugin itself. You can add the following CSS(
   as an example) to your site:
 *     ```
       .mtphr-member-contact-info td {
         vertical-align: top;
         line-height: 18px;
       }
       .mtphr-member-contact-info td.mtphr-contact-widget-description {
         word-break: break-all;
       }
       @media (max-width: 991px) {
         .mtphr-member-contact-info td {
           display: block;
           word-break: break-all;
         }
       }
       ```
   
 * Feel free to adjust any part of this.

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

The topic ‘Responsive layout’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/mtphr-members.svg)
 * [Metaphor Members](https://wordpress.org/plugins/mtphr-members/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/mtphr-members/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/mtphr-members/)
 * [Active Topics](https://wordpress.org/support/plugin/mtphr-members/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/mtphr-members/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/mtphr-members/reviews/)

 * 3 replies
 * 2 participants
 * Last reply from: [metaphorcreations](https://wordpress.org/support/users/metaphorcreations/)
 * Last activity: [10 years, 7 months ago](https://wordpress.org/support/topic/responsive-layout-18/#post-6762998)
 * Status: not resolved