CODEWITHSUNDEEP
htmlcss
André Fratelli
André Fratelli

Reputation: 6068

Correct padding or margin when using fixed top bar

My client wants the site to be responsive and have a fixed-top bar. This is the layout in full width. enter image description here

But he also wants it to be responsive, so when I resize elements should adapt nicely. The body element has a 60px padding to the top, to compensate for the fixed top bar. But when I resize this is no longer enough. This is the same image with the browser window resized. Notice how the top bar overlaps the other elements.

enter image description here

I'm using bootstrap (navbar-fixed-top). Does anybody know how to fix this?

Regards.

Upvotes: 1

Views: 1381

Answers (3)

James Nicholson
James Nicholson

Reputation: 973

Uses media tags to target different screen sizes and adjust css accordingly.

have a look here.

CSS media queries for screen sizes

Upvotes: 1

user2550712
user2550712

Reputation: 3

Hard to tell without seeing any code, but try to wrap the "other elements" with a div (if not already done) and give it a top margin of 60px.

Upvotes: 0

Moduo
Moduo

Reputation: 623

Use a percentage for your padding-top instead of px.

Upvotes: 0

Related Questions