HMTL Text is not formating correctly for Mobile

Solved
Castillos
New Member
2 0 0

Hi,

I am adding a header in on my site. On Web it looks great, however on mobile it does format correctly, I have tried adding some code to format but it does not seem ti work, here is the current code I am using:

 

{% schema %}
{
"name": "Section name",
"settings": []
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}


<html>
<head>

<style>
h1 {color:black;Font-size:22px;background-color:White}
body {
@media only screen and (max-width: 600px) {
body {
background: #999;
width: 100%;
}
}
}
</style>

</head>

<body>

<h1><img src="https://cdn.shopify.com/s/files/1/0559/9949/6354/files/phone_2.jpg?v=1618290760" alt="phone" style=“width:20px;height:20px;">
<a href="tel:(800) 123-5555">
<span>Llamanos al: +(506) 83178699
<img src="https://cdn.shopify.com/s/files/1/0559/9949/6354/files/email.png?v=1618290210" alt="phone" style=“width:20px;height:20px;">
<a href="mailto:info@castillos.store">
<span>Escríbenos a: info@castillos.store




</body>
</html>

This is the Web Version

Castillos_0-1618294434190.png

 

 

This is the mobile version:

 

Castillos_2-1618294515440.png

 

I would expect the text to stay in one line and shrink in size and stay in 1 line

 

0 Likes
Natztech
Shopify Partner
642 174 424

This is an accepted solution.

Please provide website url and if your store is password protected then also provide password

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
Castillos
New Member
2 0 0

Hi @Natztech the link to the store is: https://castillos.store/

It is not password protected

 

0 Likes