Live data from Hacker News

CSS Diner

flukeout.github.io

41–50 of 121 posts

Re: CSS Diner

#41
post #34

This is great. Although, at first I thought it was one of those codepen CSS creations. For # 16, I tried the following which did not work: pickle:only-child, apple:only-child However, this worked: apple:only-child, pickle:only-child

I thought the solution was

  plate :only-child

Re: CSS Diner

#42

Cool, but it's definitely got some issues. For example, this failed: orange:last-of-type, apple:last-of-type while this worked: apple:last-of-type, orange:last-of-type

Same problem on level 9, "bento, plate" doesn't work but "plate, bento" does.

Re: CSS Diner

#44

Cool, but it's definitely got some issues. For example, this failed: orange:last-of-type, apple:last-of-type while this worked: apple:last-of-type, orange:last-of-type

This was the only issue I noticed having gone through them all, the ordering seems to be specific on a few of them.

All in all pretty fun, the tips on the right make it fairly trivial to trudge through if you're not great at CSS (like me.)

Re: CSS Diner

#46
post #41
post #34

This is great. Although, at first I thought it was one of those codepen CSS creations. For # 16, I tried the following which did not work: pickle:only-child, apple:only-child However, this worked: apple:only-child, pickle:only-child

I thought the solution was plate :only-child

That works, along with just

  :only-child

Re: CSS Diner

#47
post #29

This is great. I never knew about the universal selector (*) or the general sibling selector (~). I'm sure I'll learn a few more tricks from this as well, not finished yet.

Google[0] and Mozilla[1] both have some information on their developer sites about why avoiding the universal selector is preferable from a performance point of view.

I'm yet to find a case that has absolutely required the use of the universal selector. Has anybody else?

[0] https://developers.google.com/speed/docs/best-practices/rend...

[1] https://developer.mozilla.org/en-US/docs/Web/CSS/Universal_s...

Re: CSS Diner

#48

Earlier quoted context omitted.

Yeah I did - but I ran into an issue on level 9 (A, B) where I wasn't producing the answer it was looking for but my solution was still technically correct. I couldn't for the life of me 'unstick' myself from my initial answer. The hint could have kinda slapped my brain and jolted the more concise answer outta me. Really minor detail I know, but with a lot of these online lesson helpers people do like to have the ans…

Still trying to figure this one out.. Apparently "plate pickle, bento pickle" (or reverse order) isn't correct. Would love to see a hint/solution manual.

plate, bento

Re: CSS Diner

#49

Earlier quoted context omitted.

Yeah I did - but I ran into an issue on level 9 (A, B) where I wasn't producing the answer it was looking for but my solution was still technically correct. I couldn't for the life of me 'unstick' myself from my initial answer. The hint could have kinda slapped my brain and jolted the more concise answer outta me. Really minor detail I know, but with a lot of these online lesson helpers people do like to have the ans…

Still trying to figure this one out.. Apparently "plate pickle, bento pickle" (or reverse order) isn't correct. Would love to see a hint/solution manual.

It's simpler than that. You are supposed to select the plate and bento, not the pickles on the plate and bento.

Re: CSS Diner

#50

Level 13: Select every pickle to the right of the bento The solution `bento ~ pickle` passes, but I don't think it should. It does not select the pickles on the plates that are to the right of the bento.

I just tried this out in JSFiddle. It appears to be the correct behaviour. http://jsfiddle.net/2GzrZ/2/
Post reply on HN