Appointments mobile view not working correctly when switching theme

  • Resolved Xonwi

    (@xonwi)


    10 years, 7 months ago

    Hello,

    When I was working with the theme travelfy I inserted this code to make the mobile view look great:

    @media only screen
and (min-device-width : 100px)
and (max-device-width : 568px)
and (orientation : portrait) {
    table.appointments-legend-table td{
         float: left !important;
         margin-bottom: 15px !important;
     }

	.appointments-confirmation-wrapper fieldset{
	padding-left: 3px !important;
	width: auto;
	}

	.appointments-confirmation-wrapper fieldset div{
	width: 95% !important;
	}

	.appointments-confirmation-wrapper span{
	width: 60%;
	}
}

    However, when I switched to the theme gopress and inserted this code to the style.css, it did not look good at all.

    The appointments-plugin can be seen at site.

    Thanks in advance!

    https://www.ads-software.com/plugins/appointments/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Predrag – WPMU DEV Support

    (@wpmudev-support1)

    Hi @xonwi,

    Thanks for posting on the forums.

    I checked your site and found you have commented the added CSS code in your wpex-gopress-child theme as following.

    /*@media only screen
and (min-device-width : 100px)
and (max-device-width : 568px)
and (orientation : portrait) {
    table.appointments-legend-table td{
         float: left !important;
         margin-bottom: 15px !important;
     }

	.appointments-confirmation-wrapper fieldset{
	padding-left: 3px !important;
	width: auto !important;
	}

	.appointments-confirmation-wrapper fieldset div{
	width: 80% !important;
	}

	.appointments-confirmation-wrapper span{
	width: 50% !important;
	}
}*/

    Could you please uncomment it to see how it’s working for you?

    Kind Regards,
    WPMU DEV

    Thread Starter Xonwi

    (@xonwi)

    Hi @wpmu DEV,

    I commented the code to see if something changes with it commented out. Sadly it looks exactly the same..

    Now the code is no longer commented for you to see the effects.

    Thanks for your help I really appreciate it!

    Plugin Contributor Predrag – WPMU DEV Support

    (@wpmudev-support1)

    Hi @xonwi,

    Thank you for your reply.

    It seems this is a theme CSS conflict issue.

    To resolve this issue could you please try adding the following CSS code in the style.css file of your child theme or add it in your site using the following plugin?

    https://www.ads-software.com/plugins/simple-custom-css

    @media screen and (max-width: 768px){
  #content table {
      max-width: 420px;
  }
}

    Best Regards,
    WPMU DEV

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Appointments mobile view not working correctly when switching theme’ is closed to new replies.