HTML CSS Responsive paragraph tag
<p>I am designing a webpage and I am almost finished but there is a small issue that I can't seem to figure out.</p>

<p>HTML:</p>

<pre><code>&lt;html&gt;

&lt;head&gt;

    &lt;style&gt;
        * {margin:0; padding:0; text-indent:0; }

        .float-box-footer{display:inline-block;position:relative;height:37px;background-color:#accb32;max-width: 860px;width: auto\9;}

        .p4{font-size: 12pt; color: black; padding-left:5pt; left:0; top:7pt; font-family:National, Arial, sans-serif;position:relative;}

        .p5{font-size: 7pt; color: black; padding-left:465pt;}

    &lt;/style&gt;
&lt;/head&gt;

&lt;body&gt;

&lt;div class='float-box-footer'&gt;
    &lt;p class="p4"&gt;Learn more &lt;a href="http://www.google.com" alt="" &gt;Google.com&lt;/a&gt;
    &lt;/p&gt;

    &lt;p class="p5"&gt;© 2016 Google Google of Google. All rights reserved.&lt;/p&gt;
&lt;/div&gt;

&lt;/body&gt;

&lt;/html&gt;
</code></pre>

<p>When you run the code it shows the green bar with text in it. When you resize the web page width wise the green bar shrinks along with the webpage and stays the proper size. However, the text in the far right does not do that. Once you go so far over it goes out of view and starts wrapping. I need the text to move along with the green bar. </p>

<p>I am stuck on this part and can not seem to figure it out. Can you anyone please help me out on what I am not doing? </p>

<p>Thank you in advance</p>