bigsilk Posted September 23, 2009 Share Posted September 23, 2009 See: this pageI want to make all of the content to the right of the numbers get horizontal, such that the email: label and the text box are in line with each other.Making it look: like thisHere's what the CSS looks like: .choice_box{position:relative;height:150px;width:225px;float:left;}.choice_div{position:absolute;left:30px;top:200px;width:900px;height:130px;border:2px #c37c82 solid;}.choice_box_number{position:relative;left:7px;font-family:Tahoma,Geneva,sans-serif;font-size:60pt;color:#CCCCCC;}.choice_box_function{position:relative;top:-83px;left:50px;font-family:Tahoma,Geneva,sans-serif;font-size:15pt;color:#c37c82;}.input_box{font-family:Tahoma,Geneva,sans-serif;font-size:10pt;color:#2e2d2e;position:relative;top:-80px;left:50px;width:50px;} and the html: <div class="choice_box"> <div class="choice_box_number">1</div> <div class="choice_box_function">service</div> <div class="input_box"> <form action=""> <select name="service"> <option value="Service" selected="selected">Service</option> <option value="woman">woman's cut</option> <option value="man">men's cut</option> <option value="color">color</option> <option value="hilite">highlight</option> <option value="30_msg">30 min massage</option> <option value="60_msg">60 min massage</option> </select> </form> </div> </div> <div class="choice_box"> <div class="choice_box_number">2</div> <div class="choice_box_function">date</div> <div class="input_box"><form action="">Start: <input type="text" size="10" name="startdate"></form><img src="images/calendar.jpg"></div> <div class="input_box"><form action="">End: <input type="text" size="10" name="enddate"></form><img src="images/calendar.jpg"></div> </div> <div class="choice_box"> <div class="choice_box_number">3</div> <div class="choice_box_function">time</div> <div class="input_box"> <select name="time_of_day"> <option value="time" selected="Time of day">Time of Day</option> <option value="morning">Morning</option> <option value="afternoon">Afternoon</option> <option value="evening">Evening</option> </select> </div> </div> <div class="choice_box"> <div class="choice_box_number">4</div> <div class="choice_box_function">log-in</div> <div class="input_box"><form action="">Email: <input type="text" name="email"></form></div> </div> </div> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.