Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Treehouse Club - MASH MASH - CSS Changing Stuff in Your Style Sheet

Lauren Hunkeler
Lauren Hunkeler
2,759 Points
Posted by Lauren Hunkeler
Lauren Hunkeler
2,759 Points

How do I center my text boxes on the page?

How do I align my text boxes to be centered on the page with the logo and submit button? Here is my code... https://w.trhou.se/5ns27j36bf Hopefully this works!

Julian Gutierrez
Julian Gutierrez
19,201 Points
Julian Gutierrez
Julian Gutierrez
19,201 Points

A direct link to your workspace does not work try creating a snapshot of your workspace by going to the upper right hand corner of your workspace and clicking on the first icon "Snapshot Workspace". Then you can copy that url and past it here.

shadowheart411
shadowheart411
2,660 Points

I see the same as Julian Gutierrez's comment

Cindy Lea
Cindy Lea
Courses Plus Student 6,485 Points
Cindy Lea
Cindy Lea
Courses Plus Student 6,485 Points

Try this...

textarea { text-align: center; }input { text-align: center; }

Lauren Hunkeler
Lauren Hunkeler
2,759 Points
Lauren Hunkeler
Lauren Hunkeler
2,759 Points

I changed the code link in the original question. I hope it works for you!

I tried entering the code, { text-align: center; }input { text-align: center; } but nothing changed. I tired putting it in a few places, but with no luck.

2 Answers

Nathan Ward
Nathan Ward
7,895 Points
Nathan Ward
Nathan Ward
7,895 Points

If you increase your .choice-bucket class from 44.44444%% width to 50% this should make the boxes centered.

So

.choice-bucket {
  width: 44.44444%;
  font-size: 18px;
  text-align: center;
  float: left;
  display: inline-block;
  margin: 0;
  padding: 0;
}

Will become:

.choice-bucket {
  width: 50%;
  float: left;
  display: inline-block;
  margin: 0;
  padding: 0;
}
Lauren Hunkeler
Lauren Hunkeler
2,759 Points
Lauren Hunkeler
Lauren Hunkeler
2,759 Points

Thanks so much! I appreciate it :)