homepage Welcome to WebmasterWorld Guest from 54.204.94.228
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Float text at end of Unordered list?
barkster



 
Msg#: 4385027 posted 8:47 pm on Nov 8, 2011 (gmt 0)

How do I get some text to go at the end of an unordered list instead of the line below?

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
total items...

I'd like to have it display like

1 2 3 total items

instead of

1 2 3
total items

 

Paul_o_b

10+ Year Member



 
Msg#: 4385027 posted 9:28 pm on Nov 8, 2011 (gmt 0)

There are a number of ways you could do it but I suppose the simplest is to make them both display:inline.

e.g.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
.items{
margin:0;
padding:0;
list-style:none;
display:inline;
}
.items li{display:inline}
.total{margin:0;display:inline}
</style>
</head>

<body>
<ul class="items">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<p class="total">total items</p>
</body>
</html>


penders

WebmasterWorld Senior Member penders us a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



 
Msg#: 4385027 posted 9:31 pm on Nov 8, 2011 (gmt 0)

Or float:left the list-items ?

barkster



 
Msg#: 4385027 posted 9:36 pm on Nov 8, 2011 (gmt 0)

Thanks, that fixed it. I had one of my styles wrong. I had .pagination ul { instead of ul.pagination and it wasn't even applying it to my list. Thanks

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved