Image with Text Overlay - but want to see the whole image and not have it resizing

New Member
3 0 0

THIS DISPLAYS THE WHOLE IMAGE WITHOUT TEXT

 

<div class="page-width" style="text-align: center;"><img src="https://cdn.shopify.com/s/files/1/0032/8171/5235/files/Recharge.png?v=1579529326" style="float: none;"></div>
<div class="page-width">
<div style="background: #FFFFFF; padding-top: 1rem; padding-bottom: 1rem;"></div>
</div>

 

HOWEVER WHEN I THEN TRY TO PUT TEXT OVER IT USING THE FOLLOWING CODE I ONLY SEE PART OF THE IMAGE - WHAT DO I NEED TO CHANGE TO SEE THE WHOLE IMAGE ON THE SCREEN?

 

<div class="page-width" style="text-align: center;">
<div style="background-image: url('//cdn.shopify.com/s/files/1/0032/8171/5235/files/Recharge.png?v=1579529326'); padding-top: 4rem; padding-bottom: 4rem; background-position: center; float: none;">
<div class="text-width text-center">
<h1 style="margin-bottom: 2rem;" class="h1--mini section-block__title"><span style="color: #ffffff; font-size: 36px;"><strong>RECHARGE</strong></span></h1>
<p style="text-align: left;"><span style="color: #ffffff;">Rage against the ordinary with the strongest nootropic capsule on the market. Offering unparalleled improvement in focus, concentration, learning, memory, clarity, reaction time, reflexes and mental energy.</span></p>
<p style="text-align: left;"><span style="color: #ffffff;">Our blend of 9 natural nootropic ingredients combines ancient wisdom from the 4 corners of the world to offer a boost in mental performance geared for modern day Philosophers, Poets, Warriors, Ninjas and Time Travellers.</span></p>
<p style="text-align: left;"><span style="color: #ffffff;">Game ONN nootropic capsules may optimise your neurotransmitters for maximum mental performance and</span><span style="color: #ffffff;"> offers a number of unique factors:</span></p>
<ul class="ticks" style="text-align: left;">
<li style="text-align: left;"><span style="color: #ffffff;">NO CRASHES,</span></li>
<li style="text-align: left;"><span style="color: #ffffff;">NO ANXIETY,</span></li>
<li style="text-align: left;"><span style="color: #ffffff;">NO JITTERS,</span></li>
<li style="text-align: left;"><span style="color: #ffffff;">NO BURN OUT,</span></li>
</ul>
<p style="text-align: left;"><span style="color: #ffffff;">Whilst also improving: Brain Health Fighting Stress Mental and Physical recovery.</span></p>
</div>
</div>

0 Likes
Highlighted

Hi @Onnor 

 

Shoot me a message below and I'll have a look at it for you. 

https://www.inspiresmallbusiness.com/pages/contact-clayton

 

Cheers 

Clayton Bates 

P.S If you want a awesome , extremely detailed , Free website review check out the below link


www.inspiresmallbusiness.com


P.P.S If you want to view VIDEO TESTIMONIALS from our awesome clients check out the above link. 


 

0 Likes