html-lists

Left align ol numbers with the heading in the same “column”

。_饼干妹妹 提交于 2019-12-11 12:06:08
问题 For the sake of simplicity, I've put everything in the HTML part: <section style="text-align:center;"> <h3>FRUITS</h3> <ol> <li>Apples</li> <li>Bananas</li> <li>Oranges</li> </ol> </section> How to make every number of ol to be aligned by the same "column"? I would like to get this: FRUITS 1. Apples 2. Bananas 3. Oranges 回答1: For left align the list numbers with the heading. body { text-align: center; } section { display: inline-block; text-align: left; } ol { list-style: none; padding: 0; }

Display list items on top of each other

你说的曾经没有我的故事 提交于 2019-12-11 11:58:42
问题 I'm aiming to move through list items, fading one out as the other fades in. I need all three of these list items to display on the same line, on top of each other. Should work with images of varying widths, the only common attribute may be the top position, relative to the div it is in. Link .container { display:table; margin: 0 auto; } ul { list-style-type:none; } To explain a little better, I need these items, whether it's text, images, divs of varying sizes to be in the middle of the

CSS: Horizontal UL: Getting it centered

三世轮回 提交于 2019-12-11 11:45:20
问题 I'm trying to make a horizontal menu/list. It has a mix of independent buttons and buttons that are wrapped in their own individual forms. With much hacking I got all of the buttons, in forms and not in forms to align horizontally. I haven't been able to get the whole thing to center on the page though. Could someone point out to me what I am not seeing? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:

<ul><li> show/hide sub-menu on click

痴心易碎 提交于 2019-12-11 10:42:24
问题 I would like to list my site's (built in php and wordpress) pages in the footer in such a away that all of the top level pages are listed vertically with no bullet, and those top level pages that have child pages are listed when the top-level page is clicked on. The child pages hide when it's parent page is clicked on again. I'd like it all to be in plain text with no graphics. So essentially it'd be like this: Home About The Motel V Meet The Owners | Rooms | Facilities | Galleries | Guest's

jQuery: Selecting only ul, not ul ul

◇◆丶佛笑我妖孽 提交于 2019-12-11 10:12:56
问题 I'm trying to beat a basic accordion style menu into submission – using jQuery. Here's the menu: http://www.cybart.com/bscg/ Here's a snippet of code that gives it accordion functionality: $('#access ul li').click(function(){ $('#access ul ul:visible').slideUp(); $(this).children('ul:hidden').slideDown(); }); The problem: a click on a sub-menu link makes the submenu slide up (and close). I want to keep the submenu open when the submenu link is clicked, and slide up only when a top level links

Convert Content inside div to UL li

北城余情 提交于 2019-12-11 10:09:45
问题 I have some very old server side code that creates pagination links <div class="pagination "> <span class="previous"></span> <span class="current">1</span> <a href="/article/the-hub?i=&page=2">2</a> <a href="/article/the-hub?i=&page=2" class="next">NEXT</a> </div> Is there an easy way with jquery to convert all the content within the div.pagination block to be ul li elements ? Each a tag would nee to remain, and quite possibly the span tags also. Any ideas greatly appreciated 回答1: This should

how to use asp repeater with nested bulletedlist programatically

守給你的承諾、 提交于 2019-12-11 09:55:44
问题 I'm new to using repeaters in vb and I'm trying to understand how to it with a nested bulletedlist programatically. I have the code that generates my data within a System.Web.UI.WebControls.TreeView object and I'm trying to put it into a nested bulletedlist list. I have the following vb and asp code: TreeView.aspx <asp:Repeater ID="repeater" runat="server" EnableViewState="False" OnItemDataBound="repeater_ItemDataBound"> <HeaderTemplate> <ul> </HeaderTemplate> <ItemTemplate> <li> <asp

Use Flexslider's selector property to skip some slides in DOM descending order

懵懂的女人 提交于 2019-12-11 09:11:58
问题 Why can't I have Flexslider's "selector" property to work properly when targeting slides that are not the very one after the other in DOM order? Basically, I found that targeting .testA would work whereas targeting .testB , .testC , or .testD would fail . <ul class="slides"> <li class="testA testB"><img/></li> <li class="testA testC"><img/></li> <li class="testB testD"><img/></li> <li class="testC testD"><img/></li> </ul> Failing here actually means that it displays properly at first, but

Strange TABLE margin behaviour inside LI element

北城余情 提交于 2019-12-11 08:43:45
问题 I found a very strange margin behaviour for table when it's inside LI element. Inside LI the TABLE has additional margin at the top which cannot be cancelled by using "margin" or "padding" CSS styles. The only way to cancel this -- is to set "display: block" for LI (by default it's "display: list-item"). Here is the code: <!DOCTYPE html> <html> <head> <title>Strange table margin behaviour</title> </head> <body> <ul> <li style="border: 1px solid #009; margin: 0; padding: 0;"><table style=

Arrange Drop-Down Submenu Items Horizontally, Wrapped (Modified TwentyTwelve WordPress Theme)

☆樱花仙子☆ 提交于 2019-12-11 08:34:10
问题 The site I'm working on uses the modified WordPress TwentyTwelve theme. The standard drop-down menu of that theme has been modified to push the content down when the submenu opens: Problem: I want to arrange the sub-menus neatly along the entire width of the content area (960px wide), rather than having them drop down under each other. If the number of submenu items is large, I want the submenu to wrap over several lines, but have the items arranged in neat vertical rows. 回答1: Here's how I