Powered by Blogger.
Showing posts with label CSS. Show all posts
Showing posts with label CSS. Show all posts

Wednesday, August 18, 2010

The Total Newbie’s Guide to jQuery: Select Elements and Manipulate CSS with jQuery

This article, as well as a follow-up article coming next week, are excerpts from Chapter 2 of the new SitePoint book, jQuery: Novice to Ninja, by Earle Castledine and Craig Sharkie. You can grab the entirety of Chapter 2, as well as Chapters 1 and 7 and the complete code archive for the entire book for free here. Together, these two articles constitute an introduction to jQuery for designers who’ve only ever worked with CSS and HTML.
If you’ve been wanting to learn the basics of jQuery and start adding some dynamic interactions to your website, this is the place to start. If you’d like to follow along with the code in this article, download the sample, which includes all of the code examples from the book.
Read more »
Posted by Laura Wilson at 7:20 AM 0 comments
Labels: , , , , , , ,

Friday, July 23, 2010

How to make textarea same width with textbox in Chrome cross-browsers

Thanks to the *brilliant* CSS box model, very simple tasks have become a nightmare.

I've been struggling lately to do a very simple thing which is to make a textbox (ie. <input type="text" /> ) and a textrea same width so that they align nicely.

The problem with making a textbox and textarea same width is that all browsers add 1px padding to textboxes that can't be removed, in other words setting the padding to 0px won't remove that 1px padding, a common trick to get rid of padding is to float the element but unluckily this doesn't work with textboxes, well, this means we have extra 2px in the width of the textbox that we simply can't get rid of. Now this won't be a problem if the same thing applies to textreas as well but unfortunately this is not the case, in most browsers (IE, Safari and Chrome) setting the padding of a textrea to 0px *unfortunately* works. One exception to this is FireFox which applies the 1px non-removable padding to textareas as well, this is why the problem doesn't exist with FireFox, but should we ignore IE, Safari and Chrome and assume everybody is using FireFox? I guess not, it makes more sense to make it work in those browsers and find a hack for FireFox and actually this is what I did.
Read more »
Posted by Laura Wilson at 2:51 AM 0 comments
Labels:

Monday, July 19, 2010

Common CSS code to change html elements look and feel

Introduction

Lets first see what is CSS. Cascading Style Sheets (CSS) is a stylesheet language used to describe the appearance of a document/page written in a HTML/XHTML.

How to use CSS code into your page?

There are two ways to do that

1. By including link tag in the .aspx/.html page. Ideally this should be specified inside <head></head> however you can place following code at any place of the page.

<link href="/default/MyClass.css" type="text/css" rel="stylesheet" />
In this case you need to specify the css code into MyClass.css file that should be kept in your root/default folder.
Read more »
Posted by Laura Wilson at 10:45 PM 0 comments
Labels:
Subscribe to: Posts (Atom)

  ©Template by Dicas Blogger.

TOPO