Get help. Give help. A Web Design and Development Community.

Centering Overlapping Badge In Header + Responsive Design

  • # March 11, 2013 at 12:37 am

    Hey, two specific questions concerning this web app in progress:

    1) I’m trying to center that BP badge in the header, but have the width of the banner/header be more narrow than the badge itself. This is the Illustrator mockup of what it SHOULD look like:

    Is it possible to nest it within the header div and still have it break out, or is it more practical to put in a different div altogether and just position it manually? I’ve tried to do the latter, but it breaks Bootstrap’s responsive navbar and the text doesn’t link/a:hover properly, which brings me to my next point:

    2) The text in the header (and the spacing/line-height of some of the divs) look awful when the window is sized down to a phone’s dimensions, so I’m wondering if it’s possible for the text to be underneath. Mockup here:

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

We have a pretty good* newsletter.