Month: February 2010

L

Large CSS background moves on resize, in IE 8

This post is in continuation to the a solution given by webdesignerWall, regarding the use of large CSS backgrounds in your website. You can check the site below: http://www.webdesignerwall.com/tutorials/how-to-css-large-background/ The solution he states is that of using display:table; for body tag wherein you are specifying your large background. The solution works quite fine! But when ...

j

jQuery Integration with BlogEngine.Net

Let me make it simple and easy to understand: Step 1 : Load the jquery script file, as below: <script src="/js.axd?path=script/jquery-1.3.2.min.js" type="text/javascript"></script> Step 2 : Copy the jquery script to a folder named script inside the theme folder. Step 3 : Register jquery it the site head, as below: <script type="text/javascript"> $j = jQuery.noConflict(); $j(document).ready(function() ...

T

Third party tool styles overriding my styles?

You might come across this scenario wherein, you want to override a css class of a third party add-in, but still not able to apply your styles. Well the reason is nothing but the concept of cascading coming into play. In this case, your third party selectors have the higher precedence over your site stylesheet. ...

C

Concept of cascading in CSS

Most of us know that Cascaded Style Sheet abbreviates to CSS . But why is it called so? What is the cascading happening out in the stylesheet. Well the concept is pretty simple, but powerful. You might come across scenarios wherein, you want to override a css class of a third party add-in, but still ...

C

CSS shortcuts

Using shortcuts in css, makes your CSS look neat, clean and compressed. It should be always taken into account that, you cannot simply play around with shortcuts. Different browsers, behave differently to the shortcuts. Following are some of the simple and effective shortcuts that i use in my css: Using Zeros :You need not mention ...

A

Applying multiple css selectors to the same element

There can be scenarios wherein, you have a selector defining the width style like (w05,w30,w500 etc) and there is another set of selector that gives a border style like (b01, b02 etc...). You want to apply a full 2px border to an element and give it a width of 500px. In this case you can ...

R

Relative positioning to control absolute positioned elements

Trust me! Initially I  had a big time, figuring out what's with this positioning of relative and absolute.  Before i move into the details of this article, let me take a quick tour through the positioning css offers us. CSS Position types: Absolute : To position the elements absolutely or perfectly, with respect to a ...

H

How to disable text selection in a table

When the user drags the mouse over the rows, the row text gets selected, looking a bit awkward. Check the image below: In order to prevent the user from doing these selections and to keep the rows integrity, we can use the following options: CSS Fix -  works with all browsers except IE Controlling KeyEvents ...

j

jQuery to check the row count of a table

To get the row count of the table, in jQuery, all you need to do is use any of the following approaches: $("#mytable tr").length $("#mytable tr").size() //But the size method calls the length property internally One thing to be noted here is that the indexing is 1-based and not 0-based. For ex.: <html> <head> <script ...

C

CSS Menu Stepdown Issue

Normally when floating objects you can count on them lining up vertically until they break. That is, you could if you weren’t using IE 6. IE 6 appends a line break effect after each floated block element which will cause “stepdown”. The fix here is to make sure the line-height in the parent element is ...