Forums

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

Home Forums CSS CSS3 Example Page

  • This topic is empty.
Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #33316
    markthema3
    Participant

    I am working on a page that showcases all of the new selectors and properties in CSS3. So far I have border-image, border-radius, transitions, 2D and 3D transforms, @font-face, general sibling selector, all the attribute selectors, nth-child, first-child, last-child and first-letter demos. Any other suggestions? Should I add in selectors level 4?

    It’s on my github repo.

    #82639
    markthema3
    Participant

    No suggestions?

    #82640
    chrisburton
    Participant

    show a live example?

    #82643
    markthema3
    Participant

    @ChristopherBurton Gimme just a sec, haven’t used FileZilla in forever.

    #82644
    markthema3
    Participant

    @sl1der Yes, but this is all on one page and using transitions to show the change. The red and green hover effects on the selector demos look especially cool, imho.

    #82645
    markthema3
    Participant

    Alright, here it is.

    #82646
    chrisburton
    Participant

    cool, but not all of those examples are CSS3.

    #82647
    markthema3
    Participant

    @ChristopherBurton Oops, which ones? Found the > child selector in CSS2.1, any others?

    #82648
    markthema3
    Participant

    New idea: should I put all the css in

    contenteditable

    style blocks so that people can mess with it? just the relevant stuff, not the general page formatting, and break it up for each example.

    EDIT:

    contenteditable

    with transitions looks awesome! 0.o
    Now where’s that article on view-source buttons, I need to adapt some of that code…

    #82649
    chrisburton
    Participant

    @font-face

    #82650
    markthema3
    Participant

    So it is. I think I’ll leave it in, as it’s only recently been a usable (at least cross browser and with common formats) tool. I’ll rename the page to something about uncommon rather than specify css3. Thhen I have an excuse to change this once or twice a week as the selectors level 4 spec changes! :D

    #82651
    markthema3
    Participant

    Guess what? Editing html annd css files remotely via a nook’s terminal, sshing to your laptop, then using vi remotely is a pain in the donkey. Doing that and making the code valid on a touchscreen keyboard that barely works (much less using vi without a Ctrl key) is pretty much impossible. I put all the styles in contenteditable style blocks, but I’m not going to update it on github or my website untill I check out the code on a real screen, validate the html and test it in webkit, gecko, and khtml. I’d love to try this page in the latest build of IE 10, but I don’t curently have a development machine running Windows 7 (or any other Windows for that matter). I have Fedora Core 15 on my home-server-thats-actually-used-more-as-a-desktop and on my laptop. My ACTUAL desktop is so terribly screwy right now that the Windows 7 installer bluescreens with an unnamed error, so for now I can’t laugh about the feature support of of Internet Exploder. If anyone could give me a list of all of the demos that don’t work in IE 9 and 10 it would be much appriciated. That reminds me, I need to convert that @font-face font to a few other formats. Also, I’m thinking about making a fork of this and removing all vendor prefixes just to see what supports what. I might also see if I can get all the demos working (not including 3d transforms) to work in IE. I need to learn how to do matrix math anyways.

    An hour of typing grammaticaly correct sentences on my nook is enough, I’m gonna go to bed.

    #82744
    markthema3
    Participant

    Alright, it’s updated on github and on the live demo. Everything is contenteditable, but syntax highlighting doesn’t work, as it puts the css in spans, which doesn’t work very well.

    #82742
    markthema3
    Participant

    YAY FOR VALID CSS!

Viewing 14 posts - 1 through 14 (of 14 total)
  • The forum ‘CSS’ is closed to new topics and replies.