开发者

Is it possible to put a list inside a span tag?

I'm aware that <span> tag is an inline element while <li> is a block element. However, we have a tooltip that 开发者_高级运维uses a <span> tag and we'd like to make the text inside that tooltip into a list. However, putting <ul><li> inside span doesn't work in all browsers (and it's invalid).

This is the HTML code:

<a class='tooltip'>Text<span>Text that we want to become a list</span></a>

Is there a possible work around?


Although I would not worry to much about invalid code in this instance, given that you know about it, if the ul li is breaking in some of the code, you could do the following, which is also probably invalid:

<a class='tooltip'>Text<span>List item 1<br />
                             List item 2<br />
                             List item 3</span></a>


I think the technical answer you could be looking for is that the tooltip text should go inside the title attribute of the anchor tag itself.

<a href="link.htm" title="&bull;List item 1 &#10; &bull;List item 2 &#10;">Text</a>

It's still not "beautiful" but semantically it's closer to what you're looking for. Plus you can use javascript to pluck that title value from the anchor tag to do something prettier with.


Just use a class:

<ul class='melikenachos'>
</ul>


Try this. Chances are if you want to put a block element inside an inline element, you really want them both to be block elements:

<a class='tooltip' style="display: block;">Text
    <div>
        <ul>
            <li>Item 1</li>
            <li>Item 2</li>
        </ul>
    </div>
</a>

Or for all your tooltips:

a.tooltip{
    display: block;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜