- Html code soft hyphen mac os#
- Html code soft hyphen code#
- Html code soft hyphen Offline#
- Html code soft hyphen plus#
- Html code soft hyphen series#
Html code soft hyphen series#
This is part one of a four-part series on dashes and hyphens that is intended to replace an earlier article. Using a technique familiar to many designers, we can lay out the list items ( li) in a grid by giving them all a specific width and floating them to the left. Consider, for example, a thumbnail gallery layout based on this HTML code: This feature will come in handy in a number of situations in which the float property is currently being used for lack of a better option. When assigned to an element, a display type of inline-block causes the element to be positioned inline (like a span), but the element’s contents are laid out as if the element were a block.
Html code soft hyphen code#
If you do decide to use actual soft hyphen characters in your code, make sure you know your character encodings, because unlike most Latin-1 characters, soft hyphens are encoded differently in UTF-8, so you need to save your code with the right encoding for the soft hyphens to work.Īnother obscure-but-useful new feature making its way into Firefox 3 after all the other major browsers support it (mostly) is the inline block.
Html code soft hyphen mac os#
If you can’t remember that (I sure can’t), or if you’re on a Mac, you can find the soft hyphen in the Character Map (the Character Palette in Mac OS X).
Html code soft hyphen plus#
You can type a soft hyphen in Windows by holding down the Alt key and then typing either 0173 on the number pad, or the plus key on the number pad followed by 00AD, before releasing Alt. Some are even smart enough to ignore soft hyphens when checking your spelling! It’ll save a few bytes, and good code editors ( jEdit, for example) will display soft hyphens as normal hyphens, so you can see them in your code. Not bad as a fallback, especially compared to Safari, which used to display it as a normal hyphen! Thankfully, Safari 2 or later gets it right.ĭepending on how you edit your HTML, you may simply want to insert the soft hyphen character itself rather than the HTML character entity reference ( ). At small enough browser window sizes, a particularly long word in one of your menu items will either protrude messily from your menu into another part of the page, or force the menu to increase its width, possibly breaking your page layout.įirefox 3 will be the last major browser to add support for soft hyphens, but you don’t have to wait for it to be released to start using them! Firefox 2 simply ignores the character, leaving it invisible (and leaving your text protruding from its box). Say you’ve got a navigation menu that occupies 25% of the width of the page. This situation arises all the time in real-world web design. When a browser that supports soft hyphens encounters a long word or other long piece of text with no obvious wrap point that doesn’t fit horizontally inside a block on the page, it will look for a soft hyphen within the text and display it as a normal hyphen followed by a line break.ĭisplay this in any browser, and the long word will protrude from the side of the div. It signals a spot in the text (usually in the middle of a long word) where it would be acceptable to break the line with a hyphen. With the imminent release of Firefox 3, however, soft hyphens will be supported by all major browsers including Internet Explorer, Safari, and Opera.Ī soft hyphen is a character of text that is usually invisible. Soft hyphens are one of those obscure gems that HTML has always supported on paper, but that no one has taken any notice of because browser support has been spotty. Tucked away in the list of CSS improvements in Firefox 3 is this innocuous-looking feature: “HTML soft hyphens ( ) are now supported.”
Html code soft hyphen Offline#
Stuff like built-in support for features web applications that work offline with locally cached data, and full-page zoom that makes it easier to design for visually impaired users, are all great to see, but in this post I’m going to take the opportunity to look at a couple of features that could be easily overlooked. The browser is much faster, better looking, and sports some awesome new end-user features over its predecessor.įor us developers, much has been said about the main improvements coming in Firefox 3. If you haven’t yet checked that your site works smoothly in the new browser, now’s the time!Ī few (understandably) angry Linux users aside, the consensus seems to be that Firefox 3 represents a huge leap forward for end-users. Firefox 3 Release Candidate 1 was revealed to the world last week, which means the final release is only about a month away.