As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
EDIT:
The answers are:
zackzurn's answer.
jrummell's comment under this question.
Visual Studio 2010 shows warnings when I use capital letters for HTML attributes. For example, this will cause 2 warnings because of capital letters in cellPadding and bgColor:
<table cellPadding="1" bgColor="whitesmoke" >
Warning:
Validation (XHTML 1.0 Transitional): This name contains uppercase characters, which is not allowed.
Google HTML/CSS coding standard suggests that only lower-case letters should be used. But one can argue that capital letters sometimes improve readability of attributes.
While warnings are shown for the general HTML code, there are not warnings when capital letters are used inside ASP elements. This does not generate any warnings:
<asp:label id="lblProvider" CssClass="normalLabel1" Font-Bold="True" Runat="server">Select Provider Name:</asp:label> .
Question:
Is it appropriate to use upper case letters to improve readability of your HTML code or you should use only lower-case letters?
Why this warning is not shown for <asp: ... > elements?
Thank you for your help.
Here is the page from the XHTML spec: http://www.w3.org/TR/xhtml1/#h-4.2
Quoted below:
XHTML documents must use lower case for all HTML element and attribute
names. This difference is necessary because XML is case-sensitive e.g.
<li> and <LI> are different tags.
With regard the ASP tag not throwing errors as far as I know those tags are used by Visual Studio to generate compliant XHTML and are not the final elements that will show up in the HTML.
Simple answer:
If your doctype is XHTML 1.0 Transitional you MUST use lowercase characters to get it through the validator.
If you decide to go with any HTML doctype, you can have uppercase characters in your attributes.
Related
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I have a couple CSS files with overlapping CSS selectors that I'd like to programmatically merge (as in not just appending one file to the end of the other). Is there any tool to do this online? or a Firefox extension perhaps?
I found Factor CSS - complete with source code, but I think it does way more than I'd need. I really just want to combine CSS blocks that have the same selectors. I'll check out the source code and see if it can be converted to something usable as a TextMate bundle. That is, unless someone else manages to get to it before me.
EDIT: Even better - here's a list of web-based tools for checking/formatting/optimizing css.
No I wish there was but the programming effort seems too much since there are multiple ways to reference a single element. The best that you can do is use a runtime like FireBug to find duplicates.
I wrote a Perl utility to do this several years ago.
As well as merging one or more stylesheets into a single coherent sorted output (complete with comments to show which file(s) each property appeared in, and warnings when a property has conflicting values), you can also selectively search or merge based on the selector, the property or both.
These are handled intelligently so that, for example, if you search for the property font you also get font-size, font-weight etc (still presented inside CSS blocks with the relevant selectors that they were taken from). Likewise, selector searching tries to Do The Right (ie generally most useful) Thing. If you search for, say, the element a, it will match any block whose selector is a, a:hover, a.extlink, a#mylink, .foo a, #bar a, p a, pre > a, a + p, a img... (the last two don't directly affect the styling of the a itself but of an adjacent or descendent element, which it is often useful to know about in such a search), without matching #a, .a, etc. Of course this behaviour is optional, you can also search for an exact selector. Or a regex.
Apart from perl itself the only dependency is CSS::Tiny
It's free software, and you can get it here: cssmerge
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
Why is XHTML needed? How does it stand apart on its own from HTML? When HTML has versions 3, 4, and an expected 5, why xhtml on one hand discontinued with version 2 and suddenly shown as part of HTML5 itself http://www.whatwg.org/specs/web-apps/current-work/multipage/the-xhtml-syntax.html#the-xhtml-syntax than separate recommendation?
XHTML is useful because it can be generated and parsed with standard XML libraries. If you don't need this property, you can use HTML. In HTML 5, it is just an alternative syntax for the same language...
XHTML was not discontinued. XHTML 1.0 (and 1.1) corresponded directly to HTML 4.01. The version of XHTML that corresponds to HTML5 is just called XHTML5 to synchronize the version numbers.
XHTML 2.0 was a discontinued effort at making a completely new document language.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
Use of <hr> is still valid in HTML5 but do you think it's semantically correct and it's a part of content?
Are you using it in your projects?
I find it diffult when to add any <hr> we need to go to html code every time. using hr is mixing presentation with content.
Wordpress WYSIWYG editor doesn't have button for <hr> so if i use it then non technical client would not be able to add it if the add/remove/re-organize content.
Yup - still use it for breaking up sections of long text - not for anything else really.
If you can still see this after they so kindly closed your question - as it's to do with Wordpress really and not HR tags - here's a link that might help you out of the problem. (and to yet another mystery stackexchange that I didn't know about.
https://wordpress.stackexchange.com/questions/6033/get-a-button-for-hr-in-the-editor
I've been using this once again lately, simply because it is easy to understand what's going on for another developer reading your code:
<h1>My title</h1>
<hr>
<p>My paragraph</p>
It still is definitely more of a styling than anything else. If you want to be strict about separating style from (semantic) markup you could think of using something like with a border-bottom in CSS for example.
I think readability counts and that it works fine the way it does, even in HTML5.
That being said, I barely use it at all.
Yes, I think it's correct to use hr in html5, but only in long texts as a kind of page-break. I would never use an hr to divide functionally different sections of the page.
For me, a proper use would be in a wiki, which is primarily text based in much the same way as the earliest html pages were. It's more that many modern sites favor a design with shorter blocks or even paged text that hr tags don't seem very useful anymore.
Interesting article: http://html5doctor.com/small-hr-element/
I learned <hr> actually means "end of one section, start of another", which is the same semantically as </section><section>. Because elements like <section> already indicate this intrinsically, <hr> is more for thematic breaks, such as separating different topics within a section of prose, or between scenes in a novel. However you can use it anywhere you can use a <p>.
but I don't use it anyway.
I'd use it if there is a shift in topic or theme in your content that isn't already being marked by something else semantically (Heading or a new section).
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I'm trying to improve the style of a website. I'm looking for some examples of beautifully styled HTML elements (tables, lists, headings, etc.) that I can draw on for inspiration, or just copy and paste verbatim (if that's permitted).
Some explanation of how the styling was achieved would be nice, but is not absolutely necessary, as I can always use Firebug to reverse engineer the design. Ideally the designs should:
Be compatible with all modern browsers (which excludes IE6 IMO)
Use little or no JavaScript
Be valid XHTML transitional/strict
EDIT: Ideally, the site(s) should provide an easy way to view a list of styles for a particular element type (ordered list, table, heading, etc.)
Thanks,
Don
The best recource for specific elements and types is in my opinion by far http://www.patterntap.com.
There you browse categories like lists and tables.
alt text http://img514.imageshack.us/img514/2662/afbeelding1eu.png
For lists, Listamatic immediately comes to mind.
For everything else, I can only think of CSS Zen Garden.
Open Source Web Design has a lot of stuff available. You can see it at: oswd.org
CSS Play, by Stu Nicholls, and, of course, A List Apart are two of my own favourites.
The folks at Zen Garden think they're pretty hot. There's a large collection of different designs of the same HTML text to be admired there. Maybe you can learn something from the masters!
http://www.dynamicdrive.com/style/
http://css-tricks.com/
http://www.css-website.com/
http://cssmania.com/
http://cssline.com/
http://webdesignfromscratch.com/web-design/web-2.0-design-style-guide.php#gradients
http://www.webcreme.com/
http://css-warfare.com/
http://www.cssbeauty.com/
http://www.boxedcss.com/
http://css.maxdesign.com.au/index.htm
http://www.csselite.com/
http://www.smashingmagazine.com/2007/01/19/53-css-techniques-you-couldnt-live-without/
http://veerle.duoh.com/index.php/blog/comments/a_css_styled_table/
http://www.hunlock.com/blogs/Attach_icons_to_anything_with_CSS
http://www.designmeltdown.com/default.aspx
http://net.tutsplus.com/tutorials/html-css-techniques/design-a-beautiful-website-from-scratch/
http://inspectelement.com/articles/the-ultimate-a-z-of-the-best-design-and-development-related-sites/
For the inspirational sites, I use Firefox + Firebug. 95% of the sites listed comply to web standards, so I can peek at the code and know it's OK to use.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I have a couple CSS files with overlapping CSS selectors that I'd like to programmatically merge (as in not just appending one file to the end of the other). Is there any tool to do this online? or a Firefox extension perhaps?
I found Factor CSS - complete with source code, but I think it does way more than I'd need. I really just want to combine CSS blocks that have the same selectors. I'll check out the source code and see if it can be converted to something usable as a TextMate bundle. That is, unless someone else manages to get to it before me.
EDIT: Even better - here's a list of web-based tools for checking/formatting/optimizing css.
No I wish there was but the programming effort seems too much since there are multiple ways to reference a single element. The best that you can do is use a runtime like FireBug to find duplicates.
I wrote a Perl utility to do this several years ago.
As well as merging one or more stylesheets into a single coherent sorted output (complete with comments to show which file(s) each property appeared in, and warnings when a property has conflicting values), you can also selectively search or merge based on the selector, the property or both.
These are handled intelligently so that, for example, if you search for the property font you also get font-size, font-weight etc (still presented inside CSS blocks with the relevant selectors that they were taken from). Likewise, selector searching tries to Do The Right (ie generally most useful) Thing. If you search for, say, the element a, it will match any block whose selector is a, a:hover, a.extlink, a#mylink, .foo a, #bar a, p a, pre > a, a + p, a img... (the last two don't directly affect the styling of the a itself but of an adjacent or descendent element, which it is often useful to know about in such a search), without matching #a, .a, etc. Of course this behaviour is optional, you can also search for an exact selector. Or a regex.
Apart from perl itself the only dependency is CSS::Tiny
It's free software, and you can get it here: cssmerge