skip to Main Content

I have the following header I am trying to code responsively using Twitter Bootstrap:

enter image description here

Now for the purple menu bar I am going to use a navbar. However, for the content above, I am really trying to determine the best approach. I am stuck between using media or pull-left and pull-right. I am really unsure what the best approach for this would be.

Any recommendations as to the proper way of coding this using Bootstraps built in classes would be appreciated. Please note that only the logo would be an image, everything else would use fonts and font icons.

2

Answers


  1. Use Bootstrap grid system for the content above.

    The only thing here where the Media object suits is the “phone number and email” part.

    For “follow us” use nested rows/cols.

    It would have been a lot easier to help you if you had provided us code too.

    Login or Signup to reply.
  2. In bootstrap you should build a row with different columns. See my example:

    <div class="row">
        <div class="col-md-4">
             <p>Lef content</p>
        </div>
    
        <div class="col-md-4">
             <p>middle content</p>
        </div>
    
        <div class="col-md-4">
             <p>Right content</p>
        </div>
     </div>
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search