Today's Question:  What does your personal desk look like?        GIVE A SHOUT

 ALL

  Put Your HTML in a Box

In the first article in this series, I walked through the basics of cascading style sheets (CSS) and showed how CSS can make your code easier to maintain. CSS allows you to keep your presentation rules separate from your content, and I showed you some of the benefits this separation provides. In this article, I’ll move forward with CSS and describe how to position elements on a page.The first step in understanding how to position elements is to understand the fundamental model of CSS—the box model.The Box ModelEvery element you place on a page creates a box. You cannot always see...

3,834 0       HTML BOX DIV CONTAINER FORMAT


  Making Sites Shine with @font-face

Like many of my web designer brethren, I’m a bit of a typographic geek. And like many web designers, I’ve been frustrated (to say the least) about the historical state of web typography.At first, we were limited to a common, but very small set of “web safe” fonts. Anything beyond those fonts, we had to rely on images. Images for text not only meant we had to create and maintain dozens (if not hundreds) of images, but it introduced accessibility issues.Over time, some clever image replacement techniques evolved to address those accessibili...

5,738 0       HTML DEMO EXAMPLE FONT FACE FONT FAMILY


  Best “must know” open sources to build the new Web

Here the dump of my ultimate collection of online Web development resources and directory, oriented for the Front-End user Interface (UI). HTML5 and all related open standards are moving fast, but for now, building a whole Website/WebApp on top of that can be very inconsistent, especially across various browsers experiences. So… how to embrace new awesome web technologies ? Now, as Web Developers and Designers, we have to build on top of more stable framework. It’s here that come JavaScript jQuery, acting like interface into browser’s implementations. That how we can ...

6,041 0       OPEN SOURCE WBESITE WEB APPLICATION HTML


  6 Most Effective Methods to Code HTML and CSS

IntroductionJust few weeks ago, I have resigned as a "full on" web developer (frontend, backend, server admin and misc) and moved on to become a pure frontend developer (yay)! It is a really exciting change, as you might know frontend developer role didn't exist few years ago. Thanks to the introduction of HTML5, CSS3 and Javascript framework, frontend development has to be separated from backend due to its complexity, and I think I'm trained to fit in that gap nicely.For many years, I've equipped myself with many tools and techniques to speed up frontend development, and here I will share all...

3,164 0       DESIGN HTML CSS STYLE PATTERN


  Get vs Post in HTML form

In HTML, one can specify two different submission methods for a form. The method is specified inside a FORM element, using the METHOD attribute. The difference between METHOD="GET" (the default) and METHOD="POST" is primarily defined in terms of form data encoding. The official recommendations say that "GET" should be used if and only if the form processing is idempotent, which typically means a pure query form. Generally it is advisable to do so. There are, however, problems related to long URLs and non-ASCII character repertoires wh...

9,656 2       HTML GET POST FORM DATA SUBMISSION


  HTML above flash (transparency + z-index)

We have faced this problem many of the times. When we want to display some message on top of all layers on a page or use some feature like jQuery light boxes. Normally the flash file continues to shine through the page. No matter what you do with layering the dom elements using z-index.See the layering flash content problem definition here.Before this, people used to dodge this issue with some fixes like hiding the flash area completely and then showing a static image of the html file in its place. Then it gave a semblance of layering flash beneath html conte...

2,799 0       HTML FLASH ABOVE Z-INDEX WMODE TRANSPARE


  Interaction between JavaScript and Frameset

ou want to change more than one frame at a time? OK, well here is how to do make the trick work for you!The first thing you will need is a frameset to get you started. Again, I will use a frameset with two frames. Here is the code for the frameset page:<HTML><HEAD><TITLE>Frames Example 5</TITLE></HEAD><FRAMESET cols=\"20%,80%\"><FRAME SRC=\"page1.htm\" name=\"left_frame\"><FRAME SRC=\"page2.htm\" name=\"right_frame\"></FRAMESET></HTML>Be sure you give each frame a name using the name=\" \" attribute. I named the frames above \"left_fr...

4,129 0       JAVASCRIPT INTERACTION HTML FRAMESET FRA