Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Why is my img and search bar not staying in my nav bar?

Why is my img and search bar not staying in my nav bar?

Problem

I have a Nav Bar and an image and search bar that i want placed inside the nav bar, furthest to the right.

I posted a thread about this the other day and was told to create a container div and nest the img and search bar inside and then float the container right. I've tried doing this, but I'm still having issues. The search bar is overlapping the nav bar instead of being inside it and the profile picture is nowhere to be seen. I have included a more detailed example of my code and I'm hoping someone can find what exactly I'm doing wrong here.


http://codepen.io/donnaloia/pen/hlEjs

Problem courtesy of: stephan

Solution

in your .user-avatar img class, add float: right;

http://codepen.io/anon/pen/izGhg

Solution courtesy of: Pierre

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

Why is my img and search bar not staying in my nav bar?

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×