Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Trouble Rendering Circle Overlays in Chrome and Safari Re: Trouble Rendering Circle Overlays in Chrome and Safari

#120718
Atelierbram
Participant

Glad to see it start getting there. The `.overlayer .overlay > div` is the `div` that’s holds you’re pop-up description text: ‘Karen’s Salon etc. ( The greater-then-sign `>` is the child combinator selector, which makes it that it will only select ‘html-elements or divs or what have you’ that are direct children of the parent: [Chris did a great article about it](https://css-tricks.com/child-and-sibling-selectors/) . BTW: you can see/open up the div, can’t you, when you do `inspect element` in firefox’ firebug or chrome webdeveloper tools?) I see there is a issue with the calculated width and height which needs to be more than 290px, probably 302px, or 304px, now I think about, because of the padding on the `a` link element ( 2 x 6px = 12px + border 2 x 1px = 14 ), or do `box-sizing: border-box`. About the resizing, responsive thing: that’s a whole different can of worms that I might see about this weekend if I find the time to make some sort of simple [reduced test case](https://css-tricks.com/reduced-test-cases/) . Easier to get into details, and to the heart of the matter in that way. P.s. There is a typo in you’re css: `z-index: 20px` , which should be just the naked value without `px` like this: `z-index: 20` . Have a great weekend.