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

Brandon Brigham
Brandon Brigham
3,716 Points

Fix header of website

Hello,

Please check out the site I'm working on:

http://087.33c.myftpupload.com

The header value prop: "Let us maximize your investment income and minimize expenses."

is below the logo and I need it flush with the logo on the left. Please advise, thanks!

Steven Parker
Steven Parker
229,732 Points

The phrase appears to be aligned with the left edge of the logo now.

Could you provide a mock-up image showing how you want it to appear?

And including your code would be nice as well. :wink:

2 Answers

Steven Parker
Steven Parker
229,732 Points

I see it the same way, but you described what you wanted as "flush with the logo on the left". But now that I see the photo, I think you meant to say "flush with the logo at the top".

You still didn't provide any code, but I peeked with devtools. Wow — you've got a wild mix of things going on there, including floated flex items! That's a combination I don't think I could keep straight myself.

But the main issue here is that your message is just too wide to fit beside the logo considering the constraint imposed by the container they share. You've got a rule for ".fusion-header-wrapper .fusion-row" that sets "max-width: 1100px;". Eliminating that limit would fix it, but only for windows larger than 1390px.

Other possible solutions might be to constrain the .fusion-header-banner size to make it fit beside the logo (and the text wrap), use a smaller logo image, or use a smaller font.

I notice that in your mock-up the logo is definitely smaller.

Brandon Brigham
Brandon Brigham
3,716 Points

Hey Steven how's it goin'? =)

So I'd like it to look like this:

alt text

Right now according to two other computers it looks like this:

alt text

Which version do you see?