Display:block links Extra Padding, whitespace bug in IE
July 11th, 2008
“If a link with display: block and no explicit dimensions is inside a list item, any spaces or linebreaks that follow the list item in the code will cause extra whitespace to appear in the browser.”
Just another in the huge slew of IE browser bugs:
http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&productId=1&postId=824
Display block with “a” hyperlinks in IE Internet Explorer
July 11th, 2008
Oftentimes, you find yourself creating dynamic CSS driven menus, embedded within lists. (See every site in our portfolio). The key to this is usually the following structure (simplified):
<ul>
<li><a href="somepage.html">Home</a><li>
<>ul>
The Problem
The problem is found when setting your <a> link as
display:block
, you’ll see that although it visually renders properly within IE, and mozilla firefox, opera, etc - you will notice that IE doesn’t allow you to click anywhere within the link? What? You say?
The solution
The solution is to set a position:relative on the <a>. Like so:
<style>
a {display:block; position:relative}
</style>
&html>
Enjoy!
Javascript/CSS 100% Height (Max-Height) Function
May 28th, 2008
We can’t tell you how much we love wrestling with CSS bugs/oversights. There’s not a time when we wouldn’t want to kick back, relax, and fumble through 10-odd google pages, looking for a simple solution for giving an element 100% height.
So far, this is one of the best - 100% height solutions out there - looks like the handy work of ppk.
If you’re looking for a quick javascript fix, you’re at the right place! This function below will take in 3 parameters: The Content Object, the Container Object, and the amount of offset you’ll need.
- The Content object will contain your variable content (e.g. a <div> object), and the
- Container object will then be resized by the amount of
- Offset you have defined
Javascript Max-height Solution:
/*****************************
name: makeFullHeight
desc: gets the height of the content div, and resizes
the container to an exact px so that it’s child
elements will fill 100% height
param: contentobj - the content object (e.g. a div)
containerobj - the container object that
is being resized
offsetpx(integer) - integer amount of px to
offset, this will change depending on your
application
note: MUST BE CALLED AFTER ELEMENTS HAVE
LOADED (or before the </body> tag)
*****************************/
function makeFullHeight(contentobj,containerobj,offsetpx){
if(contentobj && containerobj){
var contentHeight = contentobj.offsetHeight;
var newHeight = contentHeight + offsetpx;
containerobj.style.height = newHeight + ‘px’;
}
}
Great PHP Date Reference
May 20th, 2008
Just thought we’d give some trackback attention to a much deserved reference page.
This reference gives one of the best explanations for addition of and subtraction using PHP’s built-in Date Function. Also, easily compute days in the future, past, etc using the simple natural language capabilities in the strtotime function:
PHP Dates, addition, future dates, using strotime
Special thanks to the guys/girls over at Art of Web
Additional PHP Date Functions
If you’re too lazy to even look at the link above, here are some of our useful PHP Date functions:
Convert MySQL Date to PHP Date Object
It is really almost redundant to create a function for it, but this will give you the idea. Also - this will return a date in php’s native unix format - Not human-readable format, you will have to convert it to the format you would like it after running this function.
function mysqlDateToPhpDate($mysqldate){
return strtotime($mysqldate);
}
Get Current Date (mysql format)
You use this function to save the current date to a mysql database.
date("Y-m-d H:i:s");
Convert to Mysql Format
You use this function to save date to a mysql database.
function toMysqlDate($somedate){
return date("Y-m-d H:i:s",$somedate);
}
Get Current Date (human-readable format)
date('m/d/y h:i a');
Get Next Year’s Date (in mysql format)
date((date("Y")+1)."-m-d H:i:s");
Add A Year to Date (not today)
Returns in Mysql Format (YYYY-mm-dd):
function addYearToMysql($somedate){
return date((date("Y")+1)."-m-d H:i:s",$somedate);
}
Is MySQL Date Passed
Pass a mysql date into this function to find out if it has passed.
function isDatePassed($somedate){
if(strtotime($somedate) > time())return false;
else return true;
}
Set all checkboxes to disabled, Check all Checkboxes
April 30th, 2008
The following code will iterate all your checkbox elements (within the form you specify), and disable them all. Tested in ie and mozilla only.
function disableAllChecks(fmobj) {
for (var i=0;i
if ( e.type=='checkbox' ) {
e.disabled = true;
}
}
}
If you want to check the checkboxes, change the red line to
e.checked = true;





