html-lists

Get Clicked <li> from <ul onclick>

由 百般思念 提交于 2019-12-17 10:34:25
问题 As a relative beginner with JS, I am struggling to try and find a solution to this. I need to find out which line of an unordered list was clicked <ul onclick="alert(this.clicked.line.id);"> <li id=l1>Line 1</li> <li id=l2>Line 2</li> <li id=l3>Line 3</li> </ul> I don't really want to add a onclick event to each individual line, I'm sure there must be a way ?? 回答1: You can use event.target for this: JS: // IE does not know about the target attribute. It looks for srcElement // This function

How to center an unordered list?

由 我怕爱的太早我们不能终老 提交于 2019-12-17 07:19:24
问题 I need to center an unordered list of unknown width, while still keeping the list-items left aligned. Achieve the same result as this: HTML <div> <ul> <li></li> <li></li> <li></li> </ul> </div> CSS div { text-align: center; } ul { display: inline-block; text-align: left; } Except my <ul> doesn't have a parent div. ul { margin: 0 auto; } doesn't work because I don't have a fixed width. ul { text-align: center; } doesn't work because the list-items won't be left aligned anymore. So how can I

How to center an unordered list?

由 |▌冷眼眸甩不掉的悲伤 提交于 2019-12-17 07:19:12
问题 I need to center an unordered list of unknown width, while still keeping the list-items left aligned. Achieve the same result as this: HTML <div> <ul> <li></li> <li></li> <li></li> </ul> </div> CSS div { text-align: center; } ul { display: inline-block; text-align: left; } Except my <ul> doesn't have a parent div. ul { margin: 0 auto; } doesn't work because I don't have a fixed width. ul { text-align: center; } doesn't work because the list-items won't be left aligned anymore. So how can I

HTML + CSS: Ordered List without the Period?

由 淺唱寂寞╮ 提交于 2019-12-17 04:23:26
问题 I think the answer to this question is no... but does anyone know of a an HTML/CSS way to create an ordered list without a period after the numbers? Or, alternatively, to specify the separator character? Ideally I don't want to do list-style-image with a different class for each number, but that's all I've been able to think of so far... That seems terribly unsemantic. IE: Default Style: 1. ______ 2. ______ 3. ______ Desired Style: 1 ______ 2 ______ 3 ______ Alternate Style: 1) ______ 2) ____

HTML + CSS: Ordered List without the Period?

由 六月ゝ 毕业季﹏ 提交于 2019-12-17 04:23:20
问题 I think the answer to this question is no... but does anyone know of a an HTML/CSS way to create an ordered list without a period after the numbers? Or, alternatively, to specify the separator character? Ideally I don't want to do list-style-image with a different class for each number, but that's all I've been able to think of so far... That seems terribly unsemantic. IE: Default Style: 1. ______ 2. ______ 3. ______ Desired Style: 1 ______ 2 ______ 3 ______ Alternate Style: 1) ______ 2) ____

What are the allowed tags inside a <li>?

由 拈花ヽ惹草 提交于 2019-12-17 04:01:41
问题 I have been searching for the list of tags that are available inside a <li> , but I couldn't find any reference. Is it possible that any standards-compliant HTML 4+ block element is allowed in them? 回答1: TL;DR : an <li> can contain any element that is valid in <body> . In the HTML 4.01 spec for lists you’ll find the relevant extract of the DTD: <!ELEMENT LI - O (%flow;)* -- list item --> This specifies that an <li> may contain flow content, which is the collection of all block and inline

How to keep indent for second line in ordered lists via CSS?

由 南楼画角 提交于 2019-12-16 23:00:11
问题 I want to have an "inside" list with list bullets or decimal numbers being all flush with superior text blocks. Second lines of list entries have to have the same indent like the first row! E.g.: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, 1. Text 2. Text 3. longer Text, longer Text, longer Text, longer Text, longer Text,

Does UL have default margin or padding [duplicate]

由 两盒软妹~` 提交于 2019-12-16 19:56:58
问题 This question already has answers here : Removing ul indentation with CSS (3 answers) Closed 10 months ago . This might seem like a dumb question, but I've added an UL to a basic page and the list seems to be off-centered. There's nothing special about the list. No specific css added: just a list. When I load live it's slightly off center. Is there a default margin or padding on the left side? <h3>Title Heading</h3> <ul id="listItems"> <li>itemOne</li> <li>itemTwo</li> <li>itemThree</li> </ul

customize ordered list-style

由 白昼怎懂夜的黑 提交于 2019-12-14 04:01:50
问题 Hey there I am trying to modify the ol list style like in that picture another website is allready dooing. But with another CSS Image instead of the circle like the form (without text) in that picture I tried the following code to rebuild what the other website is dooing, but I have no idea how to change the blue circle into a that green symbol. Can you help me? .blog-blau-liste { position: relative; margin: 0.8em 0px 0px; list-style: outside none none; counter-reset: big-numba; padding-left:

div inside ul causing problems in IE7

由 末鹿安然 提交于 2019-12-14 03:45:39
问题 I have a <ul > which contains many lis and divs. The li's are autogenerated from inputs and labels, and the divs are floated right and serve as tooltips to explain each input. The code is something as follows: <ul> <div>tooltip</div> <li>input</li> <div>tooltip</div> <li>input</li> <div>tooltip</div> <li>input</li> </ul> This works fine in firefox and IE8, but in IE7, it assumes that each div is part of the previous <li >, and completely drops the </li > tags from the interpreted source code
订阅 html-lists