HTML (Hyper Text Markup Language) is the language behind the web pages of the Internet, created by Tim Berners-Lee, and uses a system of tags for applying layout, formatting and links to content. CSS (Cascading Style Sheets) are used to describe the presentation of the HTML. This section contains howtos, tips and tricks about how to use HTML and CSS.
If you’ve used a mobile device (e.g. iPhone, iPad, Android phone or tablet) to fill out web forms you’ll often find the @ symbol is present on the on-screen keyboard in email fields sometimes, but not always. Use type="email" instead of type="text" in the input field and it should show the at symbol on the on-screen keyboard.
It’s easy to overlook the basics sometimes and be a clever dick with some overly complicated Javascript solution when there’s a nice easy HTML attribute that can solve the problem. In this post, I’m talking about the target attribute of the <base> tag which I suddenly had an "ohhhhh" moment with yesterday. There’s no need to use jQuery/Javascript to target links to _top, for example, just set the target in the base tag.
This post is to answer a question asked in the comments section of my "Show and hide an element with jQuery – Part 1 of 2" post from a couple of years ago. It’s a pretty simple question, asking how to have an element hidden with CSS at first and then show it with jQuery later. It might be triggered automatically, or when a button is clicked or the mouse hovering over something.
In the past I’ve fallen into the trap of creating a special class for rendering lines or separators in an HTML document and assigning the class to a div, ending up with something like <div class="line"></div> or something along those lines. Not only is this not semantic, it’s a whole bunch of extra unecessary HTML code which can be simplified by styling and using the often forgotten <hr> tag.
The title property of anchor tags in HTML show the text in black on a yellow background by default in most browsers, after mousing over the anchor for a second or two. This tutorial will show you how to style the title with CSS using jQuery and a small amount of Javascript and it will appear as soon as the user mouses over the link.
Some time back I wrote about how to float a div over Flash/Vimeo/YouTube etc. The method supplied in that post works fine for Flash based media but doesn’t work for the newer way to embed YouTube videos using an iframe. This post shows the solution so you can float elements over a YouTube iframe.