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.

CSS Online Registration Form

Need help formatting an option text, that is within a select tag. I would like there to be a space in the "state"option

Hi there, I am having trouble formatting an option text, that is within a select tag. I would like there to be a space in the "state" option in my code below. When I try to give the option a padding left, nothing happens. Please let me know what you think. Thank you very much.

<!DOCTYPE html>
<html>
<head>
    <title>HTML Form</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <header class="header">THE CODE REVIEW</header>
<div class="topbar">
    <br>
    <h1 class="title">Signup for our newsletter</h1>
    <p>Get the latest news on how your code is doing right in your inbox.</p>
    <br>
    <hr size="7">
    <hr size="3">
</div>
<div class="formbox">
    <br>
    <h1 class="title aligntextleft">
        Contact Information</h1>
    <form>
    <fieldset>
     <label>Full Name</label>
      <input type="text" name="fullname"><br>
      <label>Email Address</label>
      <input type="text" name="emailaddress">
      <label>Phone Number</label>
      <input type="text" name="phonenumber">
      <label>Street Address</label>
      <input type="text" name="address">
      <label>City</label>
      <input type="text" name="city">
      <label>State</label>
        <select>
            <option value="Choose State" selected>Choose State</option>
            <option value="AL">Alabama</option>
            <option value="AK">Alaska</option>
            <option value="AZ">Arizona</option>
            <option value="AR">Arkansas</option>
            <option value="CA">California</option>
            <option value="CO">Colorado</option>
            <option value="CT">Connecticut</option>
            <option value="DE">Delaware</option>
            <option value="DC">District Of Columbia</option>
            <option value="FL">Florida</option>
            <option value="GA">Georgia</option>
            <option value="HI">Hawaii</option>
            <option value="ID">Idaho</option>
            <option value="IL">Illinois</option>
            <option value="IN">Indiana</option>
            <option value="IA">Iowa</option>
            <option value="KS">Kansas</option>
            <option value="KY">Kentucky</option>
            <option value="LA">Louisiana</option>
            <option value="ME">Maine</option>
            <option value="MD">Maryland</option>
            <option value="MA">Massachusetts</option>
            <option value="MI">Michigan</option>
            <option value="MN">Minnesota</option>
            <option value="MS">Mississippi</option>
            <option value="MO">Missouri</option>
            <option value="MT">Montana</option>
            <option value="NE">Nebraska</option>
            <option value="NV">Nevada</option>
            <option value="NH">New Hampshire</option>
            <option value="NJ">New Jersey</option>
            <option value="NM">New Mexico</option>
            <option value="NY">New York</option>
            <option value="NC">North Carolina</option>
            <option value="ND">North Dakota</option>
            <option value="OH">Ohio</option>
            <option value="OK">Oklahoma</option>
            <option value="OR">Oregon</option>
            <option value="PA">Pennsylvania</option>
            <option value="RI">Rhode Island</option>
            <option value="SC">South Carolina</option>
            <option value="SD">South Dakota</option>
            <option value="TN">Tennessee</option>
            <option value="TX">Texas</option>
            <option value="UT">Utah</option>
            <option value="VT">Vermont</option>
            <option value="VA">Virginia</option>
            <option value="WA">Washington</option>
            <option value="WV">West Virginia</option>
            <option value="WI">Wisconsin</option>
            <option value="WY">Wyoming</option>
        </select>   
      <label>Zip Code</label>
      <input type="text" name="zipcode" class="zipcode">
      </fieldset>
    </form>

</div>
</body>
</html>
body        {
            margin: 0 auto;
            width: 100%;
            }
label , p   {
            color: #797A7D; 
            padding-top: 20px;
            padding-bottom: 20px;
            display: block;
            }
.header     {
            background-color: #2E384C;
            color: white;
            text-align: center;
            font-size: 1.5em;
            padding: 5%;
            }
.topbar     {
            text-align: center;
            width: 85%;
            margin: auto;
            }
.topbar p   {
            width: 70%;
            margin: 0 auto;
            }
.title      {
            color: #2E384C;
            font-size: 150%;
            }
.aligntextleft{
            text-align: left;   
            }           
hr          {
            background-color: #2E384C;
            margin: 0.4%;
            }
fieldset    {
            border: none;
            }
form        {
            margin: auto;
            width: 100%;
            }
.formbox    {
            color: #727272;
            font-size: 120%;
            display: block;
            margin: 0 auto;
            width: 85%;
            }
form p      {
            text-align: left;
            }
.formbox fieldset input{
            display: block;
            width: 100%;

            margin: auto;
            border: 0;
            background-color: #E2E2E2;
            font-size: 110%;
            color: gray;
            }
input       {
            width:100%;
            height: 50px;
            }

.formbox .zipcode   {
            width: 50%;
            margin-left: 0;
            }
select      {
            width:100%;
            height: 50px;
            font-size: 110%;
            color: gray;
            border: 0;
            background-color: #E2E2E2;
            }
option      {
            padding-left: 30px;
            }

2 Answers

Thank you Brian!