Posts Tagged ‘html’

Force a span to honor a width

Monday, April 2nd, 2012

A span is normally a inline element so setting a width to it might not have the effects you are looking for.
In order to “force” a span to have a width it can be set as a inline-block

<span style="display:inline-block;width:92px;">&nbsp;</span>

another (better!) way is to use padding to give the span a size.

<span style="padding: 10px 20px; font-size: 0px;">&nbsp;</span>

(The font-size is here to “fix” the height of the span; and don’t forget that padding happens on both sides in this example so the end result is 20x40px)

Internet Explorer not rendering empty div correctly

Saturday, November 27th, 2010

Internet Explorer won’t render empty divs correctly.

I had a div with a height and a background image but no content; It was not rendered with the correct height it was only like one line.

A work around for this is to have some “content” inside the div (like a whitespace, a comment or why not both) then Internet Explorer renders the correct height.

<div class="some-class-with-size-and-background">
&nbsp;<!-- keep to get IE to render this div -->

HTML: UTF-8 encoding

Wednesday, July 14th, 2010

To get a html page to display UTF-8 encoded text correctly (without setting a default charset) simply add the following to the head of the html page.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Turning off password saving (on a form)

Tuesday, February 23rd, 2010

If you have a form that you do not wish to use autocompletion for (either you want to disable password auto completion “for real”, or perhaps you have a form where the saved credentials are filled in where they shouldn’t be) then a quick tip to achieve this is to set ‘ autocomplete=”off” ‘ on the form.

<form id="loginForm" action="login.php" method="post" autocomplete="off">