Get a free quote now

CSS

How to add conditional css for Internet Explorer?

April 10, 2015 - 10:02

Some alignment issues occurring in IE may be a test for your patience. We had once worked in a Drupal 6 site, and the design look well every where, but there is a small alignment problem shown up in IE. Applying a conditional style sheet saved our time. Read on to know about how to apply conditional css in a Drupal 6 site.

[Drupal] How to add web font to your site?

January 16, 2015 - 17:49

Specialized fonts beyond the typical “Arial, Geneva, Helvetica” can be embeded to your site by uploading Web Open Font Format file for the needed font in your site. Aesthetics is often very important for any website you design. If it isn't pleasing to the eyes, it will directly affect traffic. Fonts are a very important in aesthetics and readability. If you are not sure of how to add web fonts to your site then read on.

How to embed custom webfonts using font-face in your site and ensuring the bold and italics work for the font

June 05, 2013 - 23:28

@font-face allows designers to specifically embed certain fonts in to their stylesheets. Now a days many sites are providing webfonts. For eg: Fontsquirrel, Webfonts etc. They are providing us with the css too, but it is not correct. This article explain about what they are doing wrong and how to fix this issue.

[IE7 - Known Issues][CSS] CSS border for Select (Drop down) element does not work

Many a times, IE7 stands out from the group of modern web-browsers owing to its notorious incompatibility with many a standard HTML/CSS/JS. In this article, we are seeing the following case of incompatibility: CSS border for Select (Drop down) element does not work.

[IE7 - Known Issues][CSS] 'border-collapse' does not override cell spacing related tags

Many a times, IE7 stands out from the group of modern web-browsers owing to its notorious incompatibility with many a standard HTML/CSS/JS. In this article, we are seeing the following case of incompatibility: In IE7, the CSS 'border-collapse' does not override cell spacing related tags.

[Drupal 7] How to create a simple Javscript popup without using third party Javascript libraries?

December 10, 2012 - 18:13

We had come across many situations while developing Drupal based websites where we had to create Javascript popups without using third party Javascript libraries. Third party libraries often lead to dependency issues or conflicts with existing Javascript functionalities. If you want to know how to create a simple Javscript popup in your Drupal website without using third party Javascript libraries then continue reading.

How to write consistent and cross-browser compatible CSS - Ideas for Margin, Padding, Border, Height, Width

Almost all the browsers have different settings for base margins and padding. It is always important to set margin and padding for the body and html tags while styling web-pages. Otherwise it might result in some inconsistencies while displaying the pages across various browsers.

We can avoid such inconsistencies by setting margins and paddings on html and body tags to 0.

[Drupal] How to implement multiple color switches in Drupal theme?

October 12, 2012 - 16:34

Implementing multiple color mode switching is so simple! In HTML we can easily add the switching color style sheets as alternative style sheets.

But when it comes to Drupal there is a slight change. Here is how we can implement multiple color switches in Drupal theme. We normally include style sheets in .info file and we cannot specify 'alternative stylesheets' just like in HTML. So here we need a module called Drupal 'Styleswitcher'. By enabling this Drupal module you will get the option 'styleswitcher' to add alternative style sheets.

For more details just follow these steps.

Drupal Tips - How to theme the File Upload field in a WebForm using CSS and JavaScript?

The trick explained briefly

We are not actually going to theme the file upload field as it is presently nearly impossible to do that. Instead we are going to put an ordinary looking 'dummy' input text field over the file field. Next we proceed to make the 'original' file upload field invisible but accessible to the user via CSS. So when a user clicks on the dummy input text field they are actually clicking on the file upload field itself. To make it authentic we are going to copy the file path from the file upload field to the text input field via javascript.

CSS Tips: Avoid descendant selectors and improve page rendering performance

September 04, 2012 - 15:15

Developers often overlook CSS as something very simple and not requiring a lot of thought. This leads to poorly thought out CSS rules, CSS abuse, inefficient CSS and ultimately bad rendering performance and slow page load times. Here is a simple tip to improve CSS performance and page load times - avoid descendant selectors.

Drupal Tips: Common Browser compatibility issues-Background image not working in IE7/IE8/Opera

For any site - be it Drupal or non-Drupal, this is most probably due to simple mistakes made while entering attributes. Let us see one very common case where a simple mistake can cause glaring issues:

We usually see the css given something like this. We do not see any glaring issue in the class defined below.

How to Embed Fonts in CSS in a webpage

March 27, 2012 - 09:19

If we are using a custom font on our webpage and if that particular font is not installed on a user’s computer, then there is a good chance that our website would become unreadable. One of the best solutions to overcome this scenario would be to embed the said font file into the CSS in the webpage source. Checkout the most simple method of embedding fonts within a CSS.

What is CSS ?- Cascading Style Sheets

December 15, 2011 - 16:27

What is CSS? This is a common question asked by most web users hoping to understand how websites are created when they encounter the three letters on the web? Almost everyone is familiar with Html as it is a simple markup language but CSS seems to be an enigma. Since most of our work in developing web apps based on Drupal revolves around CSS, we have decided to share our knowledge with you.

Pages