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 Learning coding
.a{fill-rule:evenodd;}techdegree
Learning coding
Front End Web Development Techdegree Student 9,937 Points

How do I center my logo under two buttons?

What I have tried is <br> in order to get the logo a row down. After that I wanted to use margin-left to center the logo under the buttons. I did the flexbox course and the "What the flexbox course", but can't solve this. Can someone help me get the button centered? Thanks in advance!

My workspace https://w.trhou.se/r17nyajylr

2 Answers

blake guyan
blake guyan
8,297 Points

https://teamtreehouse.com/workspaces/23777792

does this work?

::EDIT:: somehow up voted my own reply? ::EDIT::

blake guyan
blake guyan
8,297 Points

https://w.trhou.se/vc034qf036

nm i think this was what i meant to send :p

Learning coding
.a{fill-rule:evenodd;}techdegree
Learning coding
Front End Web Development Techdegree Student 9,937 Points

Yes it worked and your answer gave more clarity :)

blake guyan
blake guyan
8,297 Points
blake guyan
blake guyan
8,297 Points

you have super complicated the code for those buttons... there were margins coming from all over the place. i got rid of all of the styling from the container, its not that you cant do it you were just doing it in an odd way, when i tried to get the pretty simple fix to work the margins that were in the page CSS were throwing those buttons on odd directions.

all I did was deleted a lot of the stuff that was hanging around the buttons in HTML and made them their own Divs with id tags. I called them up in the CSS to give them a little styling then I took the logo out of the group with the buttons created a new flex box that had the button group and the logo in, set that box to column and had the logo centred at the bottom. it messed a little with the formatting of the page but I'm sure you can figure that one out easily enough using the flexbox style..

i would just like to say im not claiming to be the master of this, I just saw a means of solving your problem and wanted to help

this should be the code, you can take a look and see if it helps you

https://teamtreehouse.com/workspaces/23777792#

Learning coding
.a{fill-rule:evenodd;}techdegree
Learning coding
Front End Web Development Techdegree Student 9,937 Points

Great, that was exactly the kind of answer I was looking for. Only the link isn't working. Maybe I can work it out with your answer, but it would be better with the snapshot. Can you send that please? Thanks for your answer!