Manish Basdeo
Manish Basdeo

Reputation: 6269

How can I display all of them in a single line using css?

How can I display all of them in a single line using csss.

        <div id="paperbusiness">
            <span id="paper">paper</span>
            <span id="business"> business</span>
        </div>

        <nav id="nav">
            <ul>
                <li><a href="yahoo.com">PORTFOLIO</a></li>
                <li><a href="googlr.com">SERVICES</a></li>
                <li><a href="gmail.com">ABOUT</a></li>
                <li><a href="testing.php">TESTING</a></li>
                <li><a href="Req.pph">REQUIREMENTS</a></li>
            </ul>
        </nav>

I need something like

paper business PORTFOLIO SERVICES ABOUT TESTING REQUIREMENTS

Upvotes: 1

Views: 89

Answers (4)

Rakesh
Rakesh

Reputation: 216

First make div and nav inline-block, then li as inline:

div, nav {
    display: inline-block;
}

li {
    display: inline;
}

Upvotes: 0

Jawad
Jawad

Reputation: 6672

Actually display: inline-block; is much better or am I missing something?

Upvotes: -1

austinbv
austinbv

Reputation: 9491

display: inline;

is all you need

Upvotes: 2

quasistoic
quasistoic

Reputation: 4687

li {
  display: inline;
}

And then apply any other styling you wish.

Upvotes: 7

Related Questions