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

Mayur Pande
PLUS
Mayur Pande
Courses Plus Student 11,711 Points
Posted by Mayur Pande
Mayur Pande
Courses Plus Student 11,711 Points

How to line up the registration form on home page

So I have this site that on the home page displays a registration form but then after a breakpoint of ~1425px it goes away.

I want to be able to change this, so the registration form stays next to the main image and text. But so that it keeps the header, and main image and text in align with each other. Until a mobile view breakpoint.

At the moment I keep having difficulties as the registration form, just keeps going underneath unless I make the width really small.

Is this possible

2 Answers

Shane Oliver
Shane Oliver
19,977 Points
Shane Oliver
Shane Oliver
19,977 Points

One of your many many many JavaScript files is changing the css position of the registration form.

Mayur Pande
Mayur Pande
Courses Plus Student 11,711 Points
Mayur Pande
Mayur Pande
Courses Plus Student 11,711 Points

Hi,

Thanks for the reply. Yes that js file, is for scrolling, so that when someone scrolls down a page, the registration form stays there.

However I am trying to move the container including the header to the left a bit, so that the registration form stays there until a mobile/tablet view breakpoint.

But if I try and keep the registraition form in view it messes with the container.

Shane Oliver
Shane Oliver
19,977 Points
Shane Oliver
Shane Oliver
19,977 Points

It can't move left, it is as far as it can go. The reason it looks like it isn't flush with the image is because the images container is 1170px wide but the image is 1000px and you have declared img: max-width: 100% in at least 5 places in your css. Change the image size it self to 1170px to fill the container or change the css to width instead of max-width and remove height auto