Question 166555 in Wordpress Question posted in
The official Wordpress documentation can be found here.

How can I change the orientation of an HTML list from vertical to horizontal in WordPress?

I have a social class provided by my WordPress theme as follows, and its placed vertically:

<div class="social">
    <ul>
        <li><a href="#"><i class="ti-facebook"></i></a></li>
        <li><a href="#"><i class="ti-twitter-alt"></i></a></li>
        <li><a href="#"><i class="ti-linkedin"></i></a></li>
        <li><a href="#"><i class="ti-pinterest"></i></a></li>
    </ul>
</div>

Iam trying to place this list in a horizontal line

display: inline!important;

But im stuck. Does anyone have an idea?

Tags:

2

Answers


  1. 0

    try this:

    .social ul {
  display: flex;
  flex-flow: row nowrap;
}
    Login or Signup to reply.
  2. 0

    Try below CSS.

    .social ul li{ display:inline-block; }
    <div class="social">
    <ul>
        <li><a href="#">facebook<i class="ti-facebook"></i></a></li>
        <li><a href="#">twitter<i class="ti-twitter-alt"></i></a></li>
        <li><a href="#">linkedin<i class="ti-linkedin"></i></a></li>
        <li><a href="#">pinterest<i class="ti-pinterest"></i></a></li>
    </ul>
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search