Mobile Display Issue

This support ticket is created 6 years, 1 month ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	-
-	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	-

Supporter timezone: Asia/Karachi (GMT+05:00)

Tagged: How to build a site with Toolset, WooCommerce

This topic contains 2 replies, has 2 voices.

Last updated by CharlesB2907 6 years, 1 month ago.

Assisted by: Waqar.

Author

Posts

November 26, 2018 at 10:24 pm #1153337

CharlesB2907

I created a form that is responsive with all fields extending the full width of the screen on mobile. Now the first 3 fields in the first column row are a fragment of the width visible in the attached screenshot.

Can someone please take look and confirm the cause and the best option to resolve it.

Thank you.

November 27, 2018 at 6:28 am #1153589

Waqar

Hi Charles,

To make sure all the search fields in the form have full width on the smaller screens, please update the following CSS code block in the "CSS editor" tab, from:


table td { 
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}

To:


table td { 
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
	width: 100%;
}

regards,
Waqar

November 27, 2018 at 6:51 am #1153598

CharlesB2907

Hi Waqar,

All fields were originally full width when I first created the form with your assistance. I was trying to understand the cause of the change. But this isn't important at this point. They are back as they were.

Thank you for everything you have done to help.