murtaugh / html5-reset Goto Github PK
View Code? Open in Web Editor NEWA simple set of best practices to get HTML5 projects off on the right foot.
A simple set of best practices to get HTML5 projects off on the right foot.
Hi! I have noticed that was a problem with listing tags. Some tags doesn't list any posts and sometimes if I have 2 posts filed under the same tag, only shows 1.
Can you help me with that? Sorry for my english if I have made any mistake.
Thanks!
Google is going to retire the plugin at some point:
May as well use the code that is part of H5BP for these bits of JavaScript:
https://github.com/paulirish/html5-boilerplate/blob/master/index.html
The viewport meta tag in the index.html file is throwing errors in Chrome.
This is due to the use of semicolons instead of comas in the content parameter.
issue commented on: http://stackoverflow.com/questions/5555125/viewport-tag-syntax
might be wrong syntax, but it fixes the problems in chrome while still working on iOS.
Hi,
First off, thank you for sharing your reset with us - it makes a nice counter-point to HTML5Boilerplate and is very helpful in developing my own. I'm just wondering why you have specified an id attribute on the head element? I haven't found any mention of this elsewhere (or my google-fu has failed me). Also, what are the use cases for a data-* attribute on head? Thanks for your time.
/Eoin/
i mostly live in google plus...
Hello,
I've noticed that the widgets disappears from my admin panel whenever i activate HTML5-Reset theme, am i doing anything wrong?
more robust code
I discovered that
img,
object,
embed {max-width: 100%;}
applied by default on those elements causes more problems than other. Would it be better to associate a class to the feature, like
.responsive {max-width: 100%;}
or maybe force the responsive behaviour on figures?
figure img,
object,
embed {max-width: 100%;}
Everytime i use html5reset i have to fix that. Maybe it's a common issue. Expecially when I have to face with full page backgrounds that setting causes strange views.
Internet Explorer up to version 11 doesn't support the main
tag and seems to apply display: inline
(at least in v11) which isn't quite what you'd expect imho.
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { border: none; padding: 0; }
http://www.karlrixon.co.uk/articles/css/remove-button-focus-outline-using-css/
Switch
<!--[if (gt IE 9)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
To
<!--[if gt IE 9]><!--><html class="no-js" lang="en"><!--<![endif]-->
Does the same thing (see H5BP - https://github.com/paulirish/html5-boilerplate/issues/425)
Hey guys!
I've noticed that you are using a generic ie class up to ie9 on your html tag.
I worked on a project lately and discovered that ie9 actually doesn't share lot's of issues as ie6-8 (6-7 mostly). Also, I found myself using this ie6-8 generic class only for css degradation (no border-radius or shadows) and specific classes for version related fixes, which didn't include ie9 since it rendered most of the code just fine.
Thanks!
IE8 & 9 are set to 'Display intranet sites in compatibility view'... they will drop into IE7 standards mode if you put the conditional comments where you've got them.
(Sorry I haven't had a chance to test in IE10 or 11)
This is also raised as an issue here.
Move them to the body tag and IE will respect the 'Edge mode' request again... and all still appears to work fine.
Several other possible solutions are discussed here - the 'pre-emptive conditional comment' method is quite neat I think
The links in the comments of style.css which should point to more info about the new font stack and the info about using your own font don't work.
Your brand new WordPress Theme HTML5-Reset looks fantastic in all aspects but one: localisation.
Everyone is so hypered up about HTML5 and CSS3 and people come with whole new sets of tools, tips and tricks, but the basics are once again simply ignored.
Localisation would make the WordPress HTML5-Reset theme a true gem for the entire world to be admired!
Instead of loading functions.js via a script tag in footer.php, load it in functions.php via wp_enqueue_script(). This way WP plugins that change scripts, for example, W3 Total Cache, will be able to minify the code.
To use this on your pages, copy the code snippet below, replacing UA-XXXXX-X with your web property ID. Paste this snippet into your website template page so that it appears before the closing tag.
http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html
The latest tagged version is still tagged to commits from February. A new tag would make installation easier for bower users who want the latest commits.
Why the bullet points can not be turned on for any class?
My class has
list-style-type: disc;
and see it there on "Inspect Element" or in FireBug but it is not rendered.
Hey all, here's a solution I added to make the little
<head id="www-sitename-com"
in header.php
a dynamic thing based on the user-entered site title, not just a static thing that would need be to be replaced.
First, I created a hook in functions.php
:
function html5reset_head_id() {
do_action('html5reset_head_id');
}
function head_id_slug() {
$headidslug = get_bloginfo('name');
$headidslug = ereg_replace("[^A-Za-z]", "", $headidslug);
$headidslug = strtolower($headidslug);
echo $headidslug;
}
add_action('html5reset_head_id','head_id_slug');
This removes all non-letter characters, even numbers, and then makes the string all lowercase.
Then, I just replaced
<head id="www-sitename-com" data-template-set="html5-reset-wordpress-theme" profile="http://gmpg.org/xfn/11">
with
<head id="www-<?php html5reset_head_id(); ?>-com" data-template-set="html5-reset-wordpress-theme" profile="http://gmpg.org/xfn/11">
So for the site I have with the title Hey It's George, www-heyitsgeorge-com is returned :)
Let me know if you guys have problems with this, if not maybe it can be added to the Reset.
Hi there,
at the end of line 126, there's what seems to be a superfluous ";}" which breaks the css or at least the font declaration for body in line 127.
i'm seeing content: "020";
when it should be content: "\0020";
otherwise, everything else looks great!
congrats on shipping 2.0, tim! :)
Using the HTML5-Reset code together with browser form validation in chrome 12: the popup bubles are no longer readable because they are transparent.
"assets" does the same thing as "" and has the added benefit of describing the contents. You'll also see "static" used as well. I'd be afraid of passing along a build kit with "" in there without first explaining what was going on. "_assets" or "static" are a lot clearer and would save me from having to write an email or get on a call to explain "".
The CSS contains the following bit of code:
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
The bit with *vertical-align
is not quite valid CSS. When using this CSS in Visual Studio 2010 (with SP1 and the "Web Standards Update" extension for CSS3 support) VS will have one warning, complaining about that particular line of code. This also prevents you from using the "Format Document" feature. The warning is:
Unexpected character sequence. Expected a property name for the "
<property> : <value>
" declaration.
As the piece of CSS in question is presumably for IE7 support (right?), the above snippet could perhaps be changed to:
input[type="checkbox"] {vertical-align: bottom;}
.ie7 input[type="checkbox"] {vertical-align: baseline;}
Should we break the Reset up into more files? (This would affect CSS the most, I think.)
A couple of thoughts:
legacy.css
file would be nice for styles that only affect older browsers.)What do you think?
I use the keyboard a lot when browsing sites and many of them use outline:none, probably without realising, which makes it impossible to know which element is currently focused. I also see many designers/developers using CSS resets and not reading the comments to replace outline:none with something else. I propose that outline:none and outline:0 should be removed and maybe a comment could be in place explaining how you can replace the outline with something else.
More info: http://outlinenone.com/
Hi,
Currently there is: /* make buttons play nice in IE */ button {width: auto; overflow: visible;}
But what about input type buttons <input type="button" value="ahsdfhasdfh asdlfjkasdklfj asd"/>
?
These buttons suffer the same fate in IE.
Shouldn't there be a reset for it too?
Thanks. D
In your declarations after "Let's default this puppy out" you have mentioned the tag "menu" twice ("[...] hgroup, menu, nav, section, menu, time, [...]").
Also you may use "body div" instead of only "div", see http://github.com/paulirish/html5-boilerplate/issues/374 .
There is an error in index.html on line 113 (including google's jQuery)
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>Needs an 'http:'
The current download is missing "http:" in the script src attribute.
script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"
There are a couple of places 2011 is still in use within index.html
:
<meta name="Copyright" content="Copyright Your Name Here 2012. All Rights Reserved.">
<footer><p><small>© Copyright Your Name Here 2012. All Rights Reserved.</small></p></footer>
iphone, android and so...
also firefox os...
It would be great to add that
This is due to incorrect use of function_exists (http://php.net/manual/en/function.function-exists.php) and php tries to treat core_mods is an variable not a string.
changing line 14 from:
if ( !function_exists(core_mods) )
to
if ( !function_exists('core_mods') )
fixes it
since you are already using google's CDN for adding jQuery to it, you could use this link to stay up to date
img,
object,
embed {max-width: 100%;}
causing problems with Google Maps Zoom controls.
Code: demo @ codepen.io
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.