Search code examples
jquerycssjquery-mobilepositiontextarea

How to place textarea next to logo?

Here is a minor example of my code. As you can see the textarea is too far from the logo. I would like it to be next to the logo (when on desktop) and below the logo (when on mobile).

The CSS of the textarea:

textarea{  
  display:block !important;
  box-sizing: padding-box !important;
  overflow:hidden !important;    
  padding:10px !important;
  width:250px !important;
  font-size:14px !important;
  border-radius:8px !important;
  border:6px solid #556677 !important;
}
Solution

  • In your CSS of the logo add the line:

    Example: (Desktop)

    #logo {
        .....
        vertical-align: middle; 
        .... 
      }

    Example: (mobile)

    @media (max-width:your width)
     {
     #logo { 
        width: your max width! or 100%;
        margin-left:auto;
        margin-right:auto;
        ....
       }
     }

    Hope that helps!