Shortcode Responsiveness issue on iPad

Dedicated support forum for CloudHost elegant bosting WordPress theme which is perfect for your business and hosting websites. Here you can ask questions and discuss with other theme users.
GK User
Fri May 02, 2014 3:32 am
Hi

I have several pages using the [textblock style="3"] shortcode, for example:
http://development.fourier.com.au/f2/product-services/onsite-remote-support/

The pages look fine on all browsers and screens including iPhone but on iPad the images and text lines are staggered.

Is there anything I can do to rectify this. Thanks in advance for any help.

This is the code I'm using:

Code: Select all
[textblock style="3"]

<a href="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet31.png"><img class="alignleft size-full wp-image-1518" alt="tickbullet3" src="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet31.png" width="14" height="13" /></a>Improve overall system performance and reliability with proactive maintenance and administration

<a href="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet31.png"><img class="alignleft size-full wp-image-1518" alt="tickbullet3" src="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet31.png" width="14" height="13" /></a>Enjoy minimal business disruption with guaranteed response times for all support requests

<a href="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet2.png"><img class="alignleft size-full wp-image-1514" alt="tickbullet2" src="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet2.png" width="18" height="20" /></a>You choose the level and type of support services that are most appropriate for your business

<a href="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet2.png"><img class="alignleft size-full wp-image-1514" alt="tickbullet2" src="http://development.fourier.com.au/f2/wp-content/uploads/2014/03/tickbullet2.png" width="18" height="20" /></a>A simple and highly accountable service with a single supplier to manage all your ICT support requirements

[/textblock]
User avatar
Senior Boarder

GK User
Fri May 02, 2014 4:11 pm
Hi,

It's because of your images class: "alignleft".

Try to add this code into css/override.css file:

Code: Select all
.alignleft {
   margin: 0;
}
User avatar
Moderator


cron