carlos-sanchez
4/27/2016 - 4:00 PM

Aligning Text Smartly in CSS http://nocode.in/aligning-text-smartly-in-css/ Here we are trying to achieve text-align: left when the text is

Aligning Text Smartly in CSS

http://nocode.in/aligning-text-smartly-in-css/ Here we are trying to achieve text-align: left when the text is more than one line in the given container.

This is very simple to achieve.

Now we want to make the same text align center if its well fitted in a single line.

aligning-text-smartly.css
content_copyfile_download
figure {
  width: 420px;
  border: 1px solid orange;
  padding: 10px;
  text-align: center; /* Set text align to center */
  float: left;
  margin: 10px;
}
figcaption {
  display: inline-block; /* Set this element to inline-block */
  text-align: left; /* Set text align to left */
}