html - Text align left in a centered div with input fields -
i have input fields supposed shown centered , texts these input fields supposed aligned left , "start" input fields.
http://jsfiddle.net/tfbatp5v/2/
.inputdes { color: #9b9b9a; font-size:20px; height: 200px; } .blue { height: 70px; } <div align="center" id="parent"> <div class="welcome">welcome</div> <div class="inputdes"> <div class="blue">text1<br><input id="inputfield1" /></div> <div class="blue">text2<br><input id="inputfield2" /></div> <div class="blue">text3<br><input id="inputfield3" /></div> </div> </div> however, no matter do, every time when use text-align: left; automatically aligns inputfields left well. tried group text areas class names doesn't work. know answer?
thanks !
try following. idea limit width of .inputdes div, put text in nested div has text-align: left. way can have inputs centered text aligned left within div.
.inputdes{ color: #9b9b9a; font-size:20px; height: 200px; width: 200px; } .inputdes > div > div { text-align: left; margin: 0 15px; } .blue{ height: 70px; } <div align="center" id="parent"> <div class="welcome">welcome</div> <br> <div class="inputdes"> <div class="blue" ><div>text1</div> <input id="inputfield1"/></div> <div class="blue" ><div>text2</div> <input id="inputfield2" /></div> <div class="blue" ><div>text3</div> <input id="inputfield3" /></div> </div> </div>
Comments
Post a Comment