0

I would like a sensible area of white underneath my "Return to Homepage" button. Probably similar to the amount above the <p> text. I keep fiddling, but can't seem to get it working.

Not via clear fix if possible

Thanks for your help.

enter image description here

{% block content %}

<div style="background: #1E7F9F;padding: 8rem;border: none !important;">
    <div style="background: #FFFFFF;padding: 2rem; margin: 1rem; margin-bottom: 5rem; border: none !important;">
        <p font-size: 1.5rem;>Thank you for your message, we will get in touch shortly</p>
        <div >
            <a class="button" style="float: left" href="{{ url_for('hello_world') }}">Return to Homepage</a>
        </div>
    </div>
</div>

{% endblock %}
tedioustortoise
  • 259
  • 3
  • 20
  • 2
    *Not via clear fix if possible* --> you are using float so you are obliged to clear float. Clearfix is only a *term* used to define this behavior. Read the duplicates to understand how you should deal with float (don't stick to only the title) – Temani Afif Jul 08 '20 at 13:14
  • Think of the clearfix as the slices of bread for your sandwich. Without the slices of bread around the ingredients, all the ingredients fall out. Without the slices of bread it's not a sandwich. It's the same way with `float` and `clear`. The floated elements are like the ingredients in your sandwich, and the clearing element is the bread around the ingredients. It's _called_ a clearFIX, but it's more like a __clearREQUIREMENT__ because it is a _part of the floated structure_ – Frits Jul 09 '20 at 06:24

0 Answers0