I cant get my footer to align left in the Tea Cozy project

Projects Skill Path Projects
1

I cant seem to get the footer to go left with a margin left of 20px unless I use negative numbers for my margin. I have tried flex box, text align and various others and the only way I can move it is with negative numbers. I know for sure I am being very stupid and missing something simple.

I have also tried the solutions in the other similarly titled thread

Helppppp!

https://github.com/BubbyJim/The-Tea-Cozy.git

2

Hi there!

Welcome to the forums!

Were you able to solve your issue? Your link does not go to a valid destination.

3

Hi, thank you!

Thanks for the reply, because of that I realised the repo I linked was private, it is now public. Does it work now?

1 Like
4

It is now accessible. :slight_smile:

It looks like there’s some funky stuff going on, so let’s get it worked out.

At the moment, the <footer> is wrapped within the #teaofthemonth <div>. I don’t know if this is on purpose, however, I moved it outside of it and it now it looks like this:

image
image808×231 35.7 KB

It’s difficult to see, but now the <footer> is underneath the featured items. Why? Let’s take a look at some CSS.

#teaofthemonth {
    height: 700px;
    max-width: 1000px;
    margin: auto;
    padding-top: 70px;
}

Here, we see that #teaofthemonth has a height of 700px. Because of this, everything is overflowing, and the <footer> appears to be incorrectly positioned. But if the height is removed, the <footer> moves back to where it’s supposed to be.

image

Now, all that’s left is to get the footer the way it needs to be.

What property would be used to get the text to the left-side of its container?

2 Likes
5

Thank you so much for your help. I also realised that I missed the closing } on the CSS for my #locationsdiv so that totally screwed everything up too. Now it is finished! Thank you again

1 Like