html-lists

问题 I have an accordion menu that works nicely. But now, I want only one parent item expanded at a time. In other words, when I click to expand one parent item, any other expanded parent item needs to collapse. I thought adding a line to slide the sibling elements up would work, but either that's not it, or I'm doing it wrong. Any ideas? Here is my jsfiddle Here is my code: CSS a { cursor: pointer; } .menu ul { list-style: none outside none; } .menu li a { line-height: 25px; } .menu > ul > li > a

问题 How do I display my h1 and ul tag in the same line? This is for my header text which is above the main content (This isn't anything to do with the question I had to add more text) This is my code: HTML: <div id="header"> <h1>Logo</h1> <ul> <li><a href="index.html">Home</a> |</li> <li><a href="fixtures.html">Fixtures & Results</a> |</li> <li><a href="news.html">News</a> |</li> <li><a href="players.html">Player</a> |</li> <li><a href="table.html">Table</a> |</li> </ul> </div> CSS: #header{

问题 Update: this problem has found a very satisfactory solution, but in production side effects popped up which I describe in this thread. So, I'm using a custom counter in my OLs to get numbering like "1 - 1.1 - 1.1.1" Works fine. But when I do this, the indentation of the LI is wrong. The text aligns with the left edge of the number, not with the right edge (like standard OLs do). Edit: To get the numbers layouted the way I want, I had to mess with the standard paddings/margins of the OL. Now

问题 I am willing to hide in the carousel div div#carousel_container - in my case - of this Flexslider 2.2 slider all <li> of a certain class but the first one . The way I'm planning to do it is to hide them all (display:none) and then use jQuery to display (display:block) the first <li> which can be identified with the following custom attribute data-gal-order = 1 . I have tried several ways: Add div#carousel_container .slides li {display:none;} in my stylesheet and then use jQuery to change only

问题 I am willing to hide in the carousel div div#carousel_container - in my case - of this Flexslider 2.2 slider all <li> of a certain class but the first one . The way I'm planning to do it is to hide them all (display:none) and then use jQuery to display (display:block) the first <li> which can be identified with the following custom attribute data-gal-order = 1 . I have tried several ways: Add div#carousel_container .slides li {display:none;} in my stylesheet and then use jQuery to change only

问题 I am having a strange css positioning issue in chrome only. I have a menu <ul> for navigation that sometimes gets pushed down randomly. Refreshing the page always fixes the problem. Strangely, sometimes if I refresh the page when it is being displayed correctly it gets pushed down. This is how it is supposed to look, and it does about half of the time: And this is what happens when it gets pushed down for some reason. The site is live, and you can experience the problem for yourself here. It

问题 Hi ive got a menu that is like this: <li id="selected"><a href="http://www."><p>FAQ'S</p></a></li> I've managed to acheive the effect that i wanted in firefox but then i checked it in IE 7 and phwoooar... It seems to be a width issue at the start i try to impeleent a width hack but then this upsets firefox: #menu li#selected { padding: 0; margin:0; background:url(nav-tab-left.gif) bottom left no-repeat #90288d; height: 35px; } #menu #selected a {background:url(nav-tab-right.gif) bottom right

问题 I want to have a menu, that I can click on to open, and click on to close. Similar to a hover menu, but with clicking, to open, and clicking to close. I have three visible list items, with submenu's under. These are hidden with css, display:none. I can get them to show, with the keyword "this", and a for loop for checking if any 'ul', have more then 1 item, then list will open when clicked. As far as I could understand this code, I got some help here earlier. Now I have read, and watched

问题 I've been trying to fix this for an hour now and can't find a solution. What I want is a centered list with background image as "ticks". I want this: Works as it should except the dots are aligned to the left of the list ul (1140px wide) and not the left of the list item li which is centered. 回答1: If you want the dots to be aligned to the left of ul , Use dot image as background: ul li { text-align: center; background: url(path/to/dot.png) 0 center no-repeat; } JSBin Demo #1 Update If you

问题 ok guys, I have had a last post about the question variables and jquery: how capture value and use them (part 3) . You can find other questions about looking for variables and jquery: how capture value and use them (part 1) and variables and jquery: how capture value and use them (part 2) . I had to do: 1. capture a value from an ul-li list; 2. insert it into a global variable ( not has been successful ); 3. use this variable for another click function. Now I present my solution code (with