Target Audience : Web Developers Hello, web developers! Here I would like to tell you how to make the round corner with shadow for banners or any other components of html. Look the code below: -moz-border-radius-bottomright: 14px; -moz-border-radius-bottomleft: 14px; -web-border-radius-bottomright: 14px; -web-border-radius-bottomleft: 14px; -webkit-border-radius-bottomright: 14px; -webkit-border-radius-bottomleft: 14px; border-bottom-right-radius: 14px; border-bottom-left-radius: 14px; -moz-box-shadow: 0 0 25px …
Category: CSS
Permanent link to this article: https://blog.openshell.in/2011/05/css-rounded-corner-with-shadow/
May 05
Clearing Floats with Overflow using CSS
One of the common problems we face when coding with float based layouts is that the wrapper container doesn’t expand to the height of the child floating elements. The typical solution to fix this is by adding an element with clear float after the floating elements or adding a clearfix to the wrapper. But did …
Permanent link to this article: https://blog.openshell.in/2011/05/clearing-floats-with-overflow-using-css/
Apr 26
What is the difference between padding and margins?
Margins and padding can be confusing to the web designer. After all, in some ways, they seem like the same thing white space around an image or object. Padding is the space inside the border between the border and the actual image or cell contents. In the image, the padding is the yellow area around …
Permanent link to this article: https://blog.openshell.in/2011/04/what-is-the-difference-between-padding-and-margins/
Mar 28
PNG transparency problem in Internet Explorer 5.5 & 6
hi friends This plugin will fix the missing PNG-Transparency in Microsoft Internet Explorer 5.5 & 6. 1. download 2. Add jQuery and pngFix to the HEAD-Section of your HTML … <head> … <script type=”text/javascript” src=”jquery-latest.pack.js”></script> <script type=”text/javascript” src=”jquery.pngFix.js”></script> … </head> 3. Activate pngFix on document.ready <head> … <script type=”text/javascript”> $(document).ready(function(){ $(document).pngFix(); }); </script> … </head>
Permanent link to this article: https://blog.openshell.in/2011/03/pngfix-internet-explorer-5-5-6/
Jan 27
How to Use External Font
Using External Font is very Easy 1.Download the font 2.If the Downloaded font is in ttf format convert it into eot format by a tool which you have to search and download or use this online convertor http://www.kirsle.net/wizards/ttf2eot.cgi 3.If the Downloaded file is in otf format convert it into ttf format and then convert …
Permanent link to this article: https://blog.openshell.in/2011/01/how-to-use-external-font/
Jan 05
CSS Tricks (Minimum Width for a Page)
Minimum Width for a Page A very handy CSS command that exists is the min-width command, whereby you can specify a minimum width for any element. This can be particularly useful for specifying a minimum width for a page. Unfortunately, IE doesn’t understand this command, so we’ll need to come up with a new way …
Permanent link to this article: https://blog.openshell.in/2011/01/css-tricks-minimum-width-for-a-page/
Jan 03
CSS trick (CSS RESET BY ERIC MEYER)
CSS RESET This piece of CSS code resets all the browser default styles preventing any browser inconsistencies in your CSS styles. html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, …
Permanent link to this article: https://blog.openshell.in/2011/01/css-trick-css-reset-by-eric-meyer/
Jan 03
CSS trick (Two classes together)
Two classes together Usually attributes are assigned just one class, but this doesn’t mean that that’s all you’re allowed. In reality, you can assign as many classes as you like! For example: <p class=”text side”></p> Using these two classes together (separated by a space, not with a comma) means that the paragraph calls up the …
Permanent link to this article: https://blog.openshell.in/2011/01/css-trick-two-classes-together/
Jan 03
CSS trick ( CSS box model hack alternative)
CSS box model hack alternative The box model hack is used to fix a rendering problem in pre-IE 6 browsers on PC, where by the border and padding are included in the width of an element, as opposed to added on. For example, when specifying the dimensions of a container you might use the following CSS rule: #box { width: …
Permanent link to this article: https://blog.openshell.in/2011/01/css-trick-css-box-model-hack-alternative/
Dec 03
5 CSS tricks you may not know
Using multiple classes together Usually attributes are assigned just one class, but this doesn’t mean that that’s all you’re allowed. You can actually assign as many classes as you like. For example: <div class=”class1 class2″></div> The class names are separates by a space. So that means “class1” and “class2” calls up the rules assigned to …
Permanent link to this article: https://blog.openshell.in/2010/12/5-css-tricks-you-may-not-know/
- 1
- 2