Support » Theme: Toolbox » HTML5 Elements – Display Block

  • jumpswimmer

    (@jumpswimmer)


    I built a child theme locally using Toolbox and was in for quite the surprise when I uploaded it to a server and ran it through crossbrowsertesting.com. My header was collapsing in certain browsers causing the navigation to be unusable. A few hours of headaches later I finally realized that the header element isn’t set to display: block anywhere in the Toolbox CSS (that I can see). I made the change and it seems to be fine for the most part now (Firefox 3.0.6 and Ubuntu 8.10 don’t quite get it right).

    Why aren’t all the HTML5 elements set to display:block? That’s one of the first things I learned about when starting into HTML5.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hi jumpswimmer,

    Toolbox does set the “header” element to display: block using the #branding selector in the CSS file.

    Thanks for the reply Lance!

    I looked through style.css in my copy and in all previous versions of Toolbox listed here:
    http://themes.svn.wordpress.org/toolbox/

    #branding doesn’t appear in any of them.

    I was about to post this, then I noticed toolbox/bonus. There is a file called sample.css in there that does reference #branding. I hadn’t touched that file previously as I saw no need to go into bonus features of something that was brand new to me.

    Anyway, it’s a problem I won’t run into again, but new users of the theme might get lost in the same way I did.

    Thanks for your feedback, I know we have some other small fixes to Toolbox — so we’ll probably update the WP.org version soon.

    As of version toolbox 1.3 the new html5 block elements still are not set to display:block. Particularly annoying are header and hgroup. This shows up as backgrounds that do not display in IE8 or lower.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘HTML5 Elements – Display Block’ is closed to new replies.