Clever Geek Handbook

Align elements in td on one line

I have a table where there are 2 text boxes and 2 buttons in the main row. http://jsfiddle.net/8qzmxwa9/1/ I am usingmargin: 0 auto; 

style='white-space:nowrap;'

on the elements so that they are on the same line. But, as you can see on the violin, they are a little uneven. How can I get them to stay on the same line.

0


source to share


2 answers 


textarea
{
  text-align: center;
  height: 35px;
  width: 280px;
  margin: 0 auto;
  font-size: 27px;

    vertical-align: bottom;
}


DEMO

+1


source


Add the same vertical alignment to everything and remove the padding for the text areas so they don't get bigger. Like this:



table, th, td 
{
   border: 1px solid black;
   font-size: 27px;
    vertical-align:middle;
    display:inline-block;
}
textarea
{
  text-align: center;
  height: 35px;
  width: 280px;
  margin: 0 auto;
  font-size: 27px;
    padding:0;
} 
button
{
  margin: 0 auto;
  font-size: 27px;
}
+1


source






More articles:


All Articles