title: float left or display inline-block is not working in styled components reactjs
body: <p><a href="https://i.stack.imgur.com/cb49a.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cb49a.png" alt="Here is the image with correct alignment"></a></p>
  
  <p>I want to get the image and text in the same div I have tried using float left and display inline-block but of no use I cant get the mistake where I am doing.</p>
  
  <p>I am getting the output as follows
  <a href="https://i.stack.imgur.com/zpcvk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zpcvk.png" alt="Here is the image after writing code I get it"></a></p>
  
  <p>I used styled components in reactjs. 
  These are the styled components I have used</p>
  
  <pre><code>export const BannerContainer = styled.div`
      width: 1280px
      height: 448px
      margin: auto
      `
  </code></pre>
  
  <p>export const BannerImageContainer = styled.div<code>
          height:448px
          width:640px
          float: left
  </code>
  export const BannerImage = styled.img<code>
          padding:96px 96px 96px 96px
          margin-left:128px
  </code></p>
  
  <p>export const BannerTextContainer = styled.div<code>
          height:448px
          width:512px
          margin-right:128px
          float: left
  </code></p>
  
  <p>export const BannerHeaderText = styled.h1<code>
          width: 352px
          height: 64px
          padding-top:40px
          font-family: Nunito
          font-size: 28px
          font-weight: 600
          line-height: 1.14
          text-align: center
  </code></p>
  
  <p>export const BannerParagraphContainer = styled.p<code>
          width: 389px
          height: 72px
          opacity: 0.38
          font-family: Nunito
          font-size: 16px
          line-height: 1.5
          text-align: center
          color: #000000
  </code></p>
  
  <p>export const SeeAllProductsButton = styled.button<code>
          width: 160px
          height: 32px
          background-color: #7C6ECC
          color: #FFFFFF
          border: 0px
          margin: 32px 112px
  </code></p>
  
  <p>This is the code for rendering it
              <code>&lt;BannerContainer&gt;
                  &lt;BannerImageContainer&gt;
                      &lt;BannerImage src={bannerImage} /&gt;
                  &lt;/BannerImageContainer&gt;
                  &lt;BannerTextContainer&gt;
                      &lt;BannerHeaderText&gt;
                          Solving the most common problems in marketing
                      &lt;/BannerHeaderText&gt;
                      &lt;BannerParagraphContainer&gt;
                          Exquisite codially mr happiness of neglected distrusts.
                          Boisterous impossible unaffected he me everything.
                      &lt;/BannerParagraphContainer&gt;
                      &lt;SeeAllProductsButton&gt;See All Products&lt;/SeeAllProductsButton&gt;
                  &lt;/BannerTextContainer&gt;
              &lt;/BannerContainer&gt;</code></p>