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

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,497 Points
Cindy Lea
Cindy Lea
Courses Plus Student 6,497 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,907 Points
Nathan Ward
Nathan Ward
7,907 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 :)