Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Create a tags box like stackoverflow's

Tags:

html

css

tags

I'd really like to know how to arrange a tag box like the one we have here a Stackoverflow.

I'm almost there, I just need to arrange the tags in a way that when the tags container width is overpassed, the tags get pushed to the left instead of to the right or downwards.

So far I have this CSS code:

#tagsContainer{
    border: 1px solid black;
    width: 400px;
    height: 28px;
    overflow-x: scroll;
}
#tagsBox{
    float: left;
}
#tagsTxtBox{
    float: right;
}

And this HTML code:

<div id="tagsContainer">
    <div id="tagsBox"></div>
    <div id="tagTxtBox"><input type="text" id="autocompletes" /></div>
</div>

Thanks in advance!

like image 222
Multitut Avatar asked Jul 09 '12 17:07

Multitut


1 Answers

Look this links: Chosen and Token Input. Both I found here on the forum: jQuery plugin for a simple input box for comma-separated tags with autosuggest

like image 91
Filipe Manuel Avatar answered Sep 28 '22 05:09

Filipe Manuel