CSS Float: The Basics To Get You Started

This is the first a series of blog posts that I’m going to be writing that has to do with the CSS float property. I hope you can learn from this and be able to have a broader understanding of how you can use CSS to your benefit.

“So what is it good for”, you say? One of the easiest uses of the float property is to wrap text around a html block-level element.

You can make an image or even a section on your webpage have text wrap around it. I will show you examples of both.
Read more about it »

CSS Learning Resources

One of the first coding languages I taught myself was CSS. I’ve learned the wrong way and right way to do many of the tasks CSS can handle. Hopefully some of the resources below will help someone else alpong their way to CSS mastery.

Books

The first book I ever purchased about CSS was very helpful at explaining why you do certain things with CSS.

[asa personal_post]1590596145[/asa]

Another book I have used many times on ways to work around old browsers or weird quirks was helpful in my CSS learning experience.

[asa personal_post]0764579851[/asa]

The book below is a great reference for terminology and rules. A must for those who don’t remember what a :pseudo-element refers to.

[asa personal_post]0596515057[/asa]

Website Links

One of the best CSS example websites out there.

Basic menu designs done in CSS.

Great list of CSS best practices.

CSS layouts done well for almost any situation.

Random Resources

Grid calculator for your layouts.

What you should know about CSS specificity.

An Em to Px calculator.

PHP Learning resources

There are a few resources for PHP that I feel have been vital in my learning the language. From books to websites, I will try and give a short grouping that will hopefully help you understand PHP better.

Books

Some of the best help books I’ve found are written by, Larry Ullman. Here is one of his best.

[asa personal_post]0321336577[/asa]

This was my first PHP book. It’s not the greatest book out there, but if you want full application examples this is the book for you.

[asa personal_post]0764579665[/asa]

This next book isn’t a PHP book, but it is a great resource for learning MySQL. MySQL is free database component that works great with PHP.

[asa personal_post]0672327120[/asa]

Website Links

PHP cookies were something I didn’t learn from a book. Here are a few links that really helped me develop those skills. PHP and cookies. PHP.net documentation.

Here is a great forum, not just for PHP, with lots of questions answered about PHP.

I wanted to learn about REGEXP in PHP, mostly for security verification. Here are two links that helped pave the way. The basics. More advanced methods.

Just a great website with lots of PHP centered tutorials.

PHP.net. Just use it!

Random Resources

Just some good ideas to implement.

Sometimes there are good articles at Digital-Web.com about PHP.

You should at least check out .htaccess.

Great articles at alistapart.com about alot of things, including php.

Learning ASP.NET

So one of my goals this year is to learn ASP.NET. So I looked at book reviews, read blog articles, and talked to some friends as to what I should learn about ASP. I got out of it that I should learn C#, learn what MVC is, and to just start coding ASP.NET on my own.

Books Recommended

Here is the list of books that I researched were really good at the teaching the basics, and had amazing reviews on Amazon.

[asa personal_post]0975240285[/asa]

[asa personal_post]059600916X[/asa]

Online Tutorials

Also, one of the best resources for tutorials is actually asp.net. There are video tutorials from ‘best coding practices’ to ‘integrating AJAX’. You should really check them out if you like video tutorials.

Reusing Images and Repetitive Content with CSS

I work with websites that have a need for alot of images and repetitive content. One of the needs I’ve had to work with is that of not wanting to change the original image once it’s been uploaded, if the change is only temporary.

An example would be where you would need to make product links visually say “on sale”. And to do that without having to recreate thousands of images and reupload them.
A preview of what we are trying to achieve.

Image change example

A few things that I want to keep in mind.

  1. Usability for client
  2. Reusable code/images
  3. Accessibility
  4. Valid xhtml

Read more about it »

Help for bugs/issues with CSS and Internet Explorer

This is an attempt at creating a list of known issues/bugs with Internet Explorer and CSS, and documentation/help for those bugs. I hope that you find it helpful. I’ve been needing to research some of these, so I thought I should document and share. Feel free to submit your finds as well.

Articles / Websites to Help you Learn More

Read more about it »

The Lawsuit Against Target And Accessibility Rules

So I’ve been trying to follow the lawsuit against Target. And I remember when I first heard about it I started thinking, “I wonder where this will lead,” hoping that it wouldn’t create a bunch of rules and regulations I have to abide by when creating websites.

There are plenty of standards that I try to abide by as a web developer.

My fear is that this will open a door for the government to have more control over how we can use the internet and what we can use it for. There are already standards in place, like those above, that I (and many other web developers) try and abide by. I hope that Target ignoring these standards won’t create rules that infringe upon my freedom to create websites.
Read more about it »

Using PHP to Easily Create Radio Lists and Drop Downs

One thing that I find myself doing continuously is creating forms. From forms that submit info into a database, to forms that send emails. I constantly am doing repetitive processes.

Most of the time I am using server side PHP code to create or validate part of the form. So I created a few server side functions that I have found help my process along. Two things that I seem to need often are radio lists and drop down options. I needed them to be as dynamic as possible. (To work with javascript, labels, css, validation, and database information)

I created two functions: one for radio buttons, and one for drop down options. I am going to list the entire functions and than explain the different aspects of them.
Read more about it »

Today is Blog Action Day – The Environment

Today I am writing about the environment. I am trying to become more environmentally aware, and have been trying to think of some ways that I can do that in my profession. So I have decided to write about it for Blog Action Day.

Green Web Hosting! This site hosted by DreamHost.One simple thing that I’ve started doing is using hosting that has gone green. I’ve found this is really easy, and doesn’t require that much work on my part, but it can make a huge difference. You can even use it to promote your website or as a selling tool to your client.

Be More Aware

I’ve had a desire to be more recycle minded. So I’ve tried to take that more into account with what I do and where I work. So I’ve started to do a few things…
Read more about it »

CSS Off Contest – Wikinetic – The Judging Block

So, I love critique. It is always unexpected, and you learn from it. Even if you hate to admit it, you do learn. That’s why I love CSS Off so much! But now to recap some things that were said about my entry. Here is the link where my critique is, I’m the last.

But first, my entry was the smallest size! I’d say I’m proud of that. :D

Most of the things I knew would be on there. Like, late, not working in safari, bad border on ratings, bad text-resizing, css not validating because of font instead of font-family(stupid mistake), basic browser inconsistencies, and hard to read code. ugh…thanks for pointing those out guys.
Read more about it »

Cool CSS Matted Border Effect

Cool Border

So I thought I would share a simple trick that creates a really clean effect. It’s what I call a double border. I don’t like adding borders onto the actual images I put on websites, so I’ve experimented with using css to create the borders. What I’ve found is that css rocks at doing this!

Basically you put a <div> tag around the image you want to add a border to. And add css to the div, not the image. That way we can still control the image, but we have much more variation with what we can do with borders.

Here is what the <div> and <img> html would look like.
Read more about it »

Learning to create css layout: Part 2 of 2

Okay, so this has taken awhile for me to get around to writing.

This is the second part to the learning to create css layout series. This part focuses on how to make the menu. The last part left off here.

We are going to create the menu from an unordered list. The main reason we do this, is because of semantics. When css is disabled or someone is using a screen reader it’s helps in navigation. But also it is because the menu is a list or grouping of links.

So lets start with the xhtml.

<ul>
<li><a href="#" class="active">Main 1</a></li>
<li><a href="#">Main 2</a></li>
<li><a href="#">Main 3</a></li>
<li><a href="#">Main 4</a></li>
<li><a href="#" class="last">Main 5</a></li>
</ul>

Which is pretty simple. Much cleaner than separate <td> for each link. Read more about it »