Web Development Blog

Twitter

Archive for the ‘CSS’ Category

SEO site checker is the iPhone webapp we launched a few days ago. This is the fourth iPhone web application we’ve developed and we thought it’d be useful to share some tips we learnt along the way.
1. Get inspiration
Before building anything, we like to browse through existing iPhone web apps that are [...]

14 Sep, 2009

Read more using jQuery live event

Posted by: eisabai In: CSS| Snippets| xHTML

The main purpose of this code is to have “Read more” for a long block of text (eg: comments) without having to separate the text into two div blocks and then use toggle to show/hide the 2nd block. This code simply uses CSS overflow:hidden property to hide long block of text. jQuery live [...]

This example code shows you how you can have a top branding bar similiar to diggbar in just a few lines of html and css.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<title>framebar example by Web Development Blog</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 0;
padding: 40px 0 [...]

All these CSS are used in a conditional CSS file for IE 6 to ensure CSS validity as some of the properties used here are proprietary to the IE 6 browser.

<!–[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]–>

Setting an opacity

.transparency {
filter: alpha(opacity=50);
}
Change the link to a hand cursor

a.link {
cursor: [...]

HTML

<input type="submit" id="submit" value="Search" />

CSS

#submit {
cursor: pointer;
}



Interests

Web development, Web design, Open source technologies, Portal development, APIs, Web services, Social media applications, Search engine optimisation, Mobile application development, iPhone Apps, Web 2.0, Web 3.0, Latest Internet technologies