nth-child

Firefox's CSS3 "nth-child" support?

According to css3.info's selector test, Firefox 3.0 supports some permutations of the nth-child selector. However, the code shown here (#30) doesn't work for me. It should select the empty paragraphs, so I edited my code to the following but it doesn't show in Firefox (it works in Opera). <style type="text/css"> div :nth-child(even) { ...

tr:nth-child(even) help. how to apply to one class?

im not very good with css and i need some help. i have a table where i want every other row to be gray and the alternating rows to be white. but i only want it to happen on one particular table. i added some code to my css: tr:nth-child(even) { background: #CCC; } tr:nth-child(odd) { background: #FFF; } but the proble...

jquery nth-child add html after

Hi. I have a simple unordered list with 16 list items. I want to add a new list item after every fourth existing list item using jquery How would I do that? Code below: <ul> <li>some stuff</li> <li>some stuff</li> <li>some stuff</li> <li>some stuff</li> <li class="clear">This is what I want to add</li> <li>som...

Finding nth-child of siblings via jQuery

Let's say I have two tables that look like this: TH TH TH TH TD TD TD TD TD TD TD TD and TH TH TH TH TH TD TD TD TH TD TD TD I'd like to select the 3rd column in each. At first I was using nth-child as such: $('table tr td:nth-child(3)') But that's not going to work, as 3rd TD is ...

Debugging nth-child selector

I have the following selectors: .progress:nth-child(3n+1) { background: teal; } .progress:nth-child(3n+2) { background: red; } .progress:nth-child(3n+3) { background: blue; } However all of the items end up with a teal background. Are these selectors correct? I'm thinking I should get: Teal (every 3, starting with 1) R...

JQuery nth-child not working properly

Hi Guys, I am using JQuery's nth-child selector to alter the margin on every 3rd div with a class of photo_post_thumbnail, but it alters it every 2nd div? Can anyone spot what I am doing wrong? Site http://www.clients.eirestudio.net/hatstand/wordpress/photos/ HTML markup <div class="postbox photo_post_thumbna...

Use CSS3 nth-child to alternate the float of images within DIV tags...

Basically, what I'm trying to create is a page of div tags, each has an image inside them and I'm trying to use CSS3's nth-child to alternate the float of that specific image. But for the life of me, I can't get the nth-child to locate those images. Here is my code so far... CSS .featureBlock img:nth-of-type(even) { float: left; }...

How do i select the 1st and then every 4th row in a html-table with nth-child()-selector?

Ok, math isn't my strong side, I admit it. All I want to do is to select the first, 5th, 9th, 13th, 17th etc row in a html-table. Can anybody with better math-skills point me in the right directionor perhaps supply a "nth-child-for-dummies" guide? I tried nth-child(1n+4) (which selects the 4th row and everyone after), and i also tried...

IE Fix for :nth-child selector with jQuery?

I have to validate my code for IE, I'm trying to use jQuery. The second line works perfectly (although if I add the first line, it breaks [only in IE; works fine in other browsers]). This whole snippet works in other browsers. $("ul#nav > li:nth-of-type(1n+4)").css("marginTop", "4px"); $("#templates > :nth-child(3n+5)").css("margin", "1...

nth-child doesn't respond to class selector

Unless it's not supposed to but I can't seem to get nth-child to acknowledge the class selector. I have say 4 divs inside another div, all of various classes and ids. I need to select the first instance of a div with said class. For example: #content .foo:nth-child(1) { margin-top: 0; } And obviously again with first-child to get the...

Jquery Nth-Child question

Hey Guys, How, using Nth-Child could I add a class to every red box? I have tried using: $('#mainnav li ul li:nth-child(3n)').addClass('yes'); Markup: <ul> <li><a href="">SUUB</a></li> <li><a href="">SUUB</a></li> <li><a href="">SUUB</a></li> <li><a href="">SUUB</a></li> <li><a href="">SUUB</a></li...

Wrap every 3 divs in a div

Is it possible to use nth-child selectors to wrap 3 divs using .wrapAll. I can't seem to work out the correct equation. so... <div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> becomes... <div> <div class="new"> <div></div> <div></di...

Select every Nth element in CSS

Hi, Is it possible to select, say, every fourth element in a set of elements? Ex: I have 16 <div> elements... I could write something like. div:nth-child(4), div:nth-child(8), div:nth-child(12), div:nth-child(16) is there a better way to do this? ...

jquery - variable nth-child?

Hey. I want to pass a variable as an argument into an nth-child selector. This doesn't work: var position = 5; $("#daddy > div:nth-child(position)").animate({ opacity: 0.01, }, 500);​ Is it possible though? Cheers, Jack ...

Specify multiple columns with nth-child()

Hello, I'm using nth-child in my jquery selector to identify columns to modify. I have 5 columns (1-5) and I want to modify only 2,3, and 4. Is there a way to do this with nth-child? Something like: $('#example tbody tr td:nth-child(2||3||4)') I have tried several combinations but nothing seems to work. Im pretty new to jQuery select...

:nth-child is not working in IE

Hey guys Ive searched for my specific problem and can't find it... I hope any of you guys can help. Im trying to get nth-child to work in IE - now Ive read that you can do it with Jquery, how do I implement jquery in this instance? Im also using this Lib item ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js It works perfectly i...