Simple CSS Layout Template Example

Using CSS in general is very easy. You can style an element via its definition, class and id. Redecorating an entire web site is possible just by editing its style sheets.

However, positioning elements tend to be quite a challenge. Therefore, I’ve created a sample template that will hopefully help those new to CSS to get a head start by building the site layout foundation. You should then be able to focus your effort on working on other areas of your site rather than wrestle with the overall layout.

You can view the simple CSS layout template. Alternatively, you can download a zip file containing the HTML and CSS files.

You don’t really need to edit the index.html file much, most of the magic can be controlled via style.css. The style sheet file has been commented on certain sections that will help you customize the look of the page.

If you have any questions about the sample files, just give me a shout in the comments below. I’ll do my best to answer your questions.

7 responses to “Simple CSS Layout Template Example”.

  1. papajoneh Says:

    This is useful files. Downloaded and studying it. Yep, this is the simplest basic css coding. However, person like me tend to forget it. The files is permanent addition to my css collection now.

    Thanks. 🙂

    more of this post please.

  2. aryst Says:

    Thanks Azmeen for this amazing stuff…definitely gonna study it..

  3. Site Admin Azmeen Says:

    Thanks guys… just thought that they might be useful.

    Be sure to showcase your derivative works! I’d love to see how this template gets implemented 🙂

  4. Kay Kastum Says:

    Never understand a thing about this css and the like. Will keep this post for future use baybeh! Thanks buddy for making people’s life richer. 😀

  5. ethel Says:

    How sweet of you providing us with such beautiful theme and CSS file! 😀 Whoever downloaded it and use it to learn the basic CSS, i hope they’re gonna leave the credit intact. It’s really sad seeing how some people would edit someone else’s CSS and claim it to be their own hard-work codings….

  6. Paul Says:

    nice article i think you should take a glimpse at 101 css before you can realize that you can code a css at your hand from scratch.

  7. layout » Simple CSS Layout Template Example Says:

    […] Read the rest of this great post here […]