Archived topic
How to Make Blog Post Mobile responsive
2 replies · Started by arrunadayy on June 30, 2017
Hello,
I am facing problem with making Blog post content mobile responsive. Please check http://shalinikoul.com/to-my-conscience/ on mobile. It shows correctly till tab but in mobile view content of the post does not show correctly.
Everything other than that shows correctly in mobile view.
Arrunadayy
Hi there,
I believe the <pre> tag is causing the trouble.
Text in a <pre> element is displayed in a fixed-width font and it preserves both spaces and line breaks:
https://www.w3schools.com/tags/tag_pre.asp
I think a workaround would be to add the content twice, one displays on desktop only with pre tag and one displays on mobile only without the pre tag. So something like this:
<div class="hide-on-mobile">
<pre>
content here
</pre>
</div>
<div class="hide-on-desktop hide-on-tablet">
content here
</div>
Let me know if this works.
Thanks Leo for your help.
The work around worked atleast content is being seen now.