html object styling

This section is for posting questions which are not directly related to WYSIWYG Web Builder.
Examples of off topics: web server configuration, hosting, programming related questions, third party scripts.

Note that these questions will generally not be answered by the administrators of this forum.
Post Reply
User avatar
rogerl
 
 
Posts: 197
Joined: Tue May 03, 2016 8:24 am

html object styling

Post by rogerl » Sun Dec 24, 2017 12:02 am

I recently created an html object and styled it using css giving it a border and white background then giving it 20px padding all round the contents. Viewed in desk top - perfect, on mobile, Chrome had to make padding, bottom 140px just so contents viewed appeared within border. The compromise being the desktop version has a 120px blank space on the bottom so that the mobile appearance can be correct.
Is there a way around this?
Or is this just the game we have to play to get mobile browsers to display objects correctly.
The contents of the object is text within <span></span>.
Is it something to do with the way different browsers treat text?
The page is here:
https://www.whiteshepherdsnz.com/memtzarAboutUs.html
Still have to add a couple more break points to fix mobile browsing.
Regards
Roger

User avatar
Pablo
 
Posts: 17609
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: html object styling

Post by Pablo » Sun Dec 24, 2017 7:58 am

To apply different styling for smaller screen you can use media queries, then you can set a different padding for mobile devices.

Post Reply

Who is online

Users browsing this forum: No registered users and 3 guests