Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Alex Flores
Alex Flores
7,864 Points

I can't figure this out (Position, Float, Stacking)

I've been at this all day and I do mean all day. I've been trying to create a website header where there is a company logo on the left and some additional text on the right (lots of white space in-between). The two floats are not the same size so when I float them, the right one is all the way up and I have no idea how to move it down. The only way that I've been able to make it the way that I want it is when use position: relevant in the parent and position: absolute in the child and then just move it where I want it. Problem with that is, when I collapse the browser the two elements get bunched up together, where I would like the left one to stack on the right one....... Did that make sense?

Can I post my code here?

Jason Cameron
Jason Cameron
1,796 Points

could i possible see your code if u email it to me..

Alex Flores
Alex Flores
7,864 Points

I would. Can I e-mail you within treehouse? Or how do I e-mail you?

Jason Cameron
Jason Cameron
1,796 Points

im not too sure how to email via treehouse but my email is kiocam246@gmail.com if u wish

maali2
maali2
12,539 Points

<header class="anyclass"> <a href=" " (<--- your logo) alt="my logo etc..."></a> <h1>text.......</h1> </header>

in css .anyclass set to display: inline block; and set .anyclass h1 to text-align: right;

problem with either tag a or h1 not in position, zero top and bottom margins

Ideally a href ... should have own class i.e class="logo" and text probably class="headertext" ?

2 Answers

Marco Boretto
Marco Boretto
29,821 Points
Marco Boretto
Marco Boretto
29,821 Points

Alex try to use bootstrap. It's a lot easier to work with navs, grids and css. it's already responsive and mobile oriented

Alex Flores
Alex Flores
7,864 Points
Alex Flores
Alex Flores
7,864 Points

Thanks everyone! I actually think I figured out a work around, I'm going to use media queries.