user3287550 user3287550 - 3 months ago 8
CSS Question

How to align all div content in one line?

I've this div:

<div id="footer" class="footer">
<div class="footer-container">
<p>Hello World</p> |
<span id="select-language" class="label label-info">
some text
</span>
</div>
</div>


How can I align all tag inside
footer
in one line? I tried this:

.footer-container
{
margin: 20px 0;
padding-right: 15px;
padding-left: 15px;
display: inline-block;
}

Answer

With your code the simplest way would be to use asterix as a selector to select all the elements inside the footer and give them the display: inline-block style like this (before the display attribute was given only to the footer-container):

.footer-container {
  margin: 20px 0;
  padding-right: 15px;
  padding-left: 15px;
}
.footer-container * {
  display: inline-block;
}
<div id="footer" class="footer">
  <div class="footer-container">
    <p>Hello World</p>|
    <span id="select-language" class="label label-info">
         some text
     </span>
  </div>
</div>

Comments