Hello. What’s bowser support for this?

HTML & CSS
1 
.sitemap li:nth-child(3n+1)::before {
  content:•;
  margin-left:-10px;
  position:absolute;
}

Hi! What’s browser support for this? And to confirm the position absolute is only targeting the :before right and not the li as well? Thanks!

2

I use this to find out what is and is not supported in the common browsers.

Yes, these rule apply only to the pseudo element.
But note that when defining a string as content you put it in quotes.

3

Yes as Sam said that only applies to the pseudo element but note that because you have not added a left position (e.g. left:0) then you may find differences in where browsers place that element. It all depends on what else is going on and indeed things like text-align:right or center will affect where that element ends up.

It’s usually safer to set a context (e.g.position:relative on the list) and then you can safely say left:-10px. Of course there are occasions where you may not what a stacking context so you just have make sure all browsers are doing what you expect. :slight_smile:

4

Ahh the quotes and code just got removed when I copied it from firebug. They are in the css.

5

Cool thanks for the link

6

Thanks Paul. It’s just a long list of links. Grouped in threes. So multiple bullets only on the first li of each set of three. I’ll try left zero and see where that puts it. Honestly don’t 100% know from memory lol. I am just dragging the bullet over without moving the list so I think margin will suffice. But I’ll check for good measure.

1 Like
7

Yeah I did google search earlier for browser support but apparently I don’t know the correct search term. Cuz I still can’t find the answer for browser support.

8

here’s the support for nth-child (css3):

All other properties are widely supported in that snippet.

9
10

Thanks guys. I guess it was combining them like I did that I wasn’t sure of.

11

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.