FREE THOUGHT · FREE SOFTWARE · FREE WORLD

Best CSS .Classes for CSS Toolbox

CSS Classes Toolbox .classCSS is one of the most useful tools I have in my toolbox as a Web Developer. Having a CSS Toolbox containing good CSS Classes that you repeatedly use is quite helpful for us XHTML / web-standards / best-practices developers. Check out 10 of my favorite CSS classes.

CSS

CSS Background Image Sprites

Using a CSS Background Image Sprite with the CSS background-position and background-image I can display all these icons: . I can even have them show up anywhere on the page!

CSS

Review: Posh CSS

PoshCSS.com has links to nice and new CSS Articles. Don't worry, they aren't snobs. ;)

CSS

Internet Census 2012 – Port scanning using insecure embedded devices – Carna Botnet

While playing around with the Nmap Scripting Engine (NSE) we discovered an amazing number of open embedded devices on the Internet. Many of them are based on Linux and allow login to standard BusyBox with empty or default credentials. We used these devices to build a distributed port scanner to scan all IPv4 addresses. These scans include service probes for the most common ports, ICMP ping, reverse DNS and SYN scans. We analyzed some of the data to get an estimation of the IP address usage.

Hacking

CSS Cross-Browser Compatibility Tip

Epiphany 2.18What I used to do when I was still learning CSS was to check the web page in each of the various problematic browsers to make sure the display stayed the same. I have several actual machines and several vmware virtual machines running various browers but I decided to skip all that extra time and effort and just use an online tool to do it for me. The tool views my page in all the various browsers and generates a screenshot image from each browser so that I can see if there are issues with my CSS.

Software

PullQuotes using CSS

CSS, no javascript pullquote not blockquoteI looked at a lot of different ways to display quotes and pullquotes and even though the javascript solutions are very nice, esp. the 456bereastreet.com solution, I decided to just use CSS (Keep It Simple Stupid).

CSS

Add CSS Class to body when Sidebar is Present

Here's the problem I was having while working on a custom theme for a client. Certain pages, posts, tag pages, archive pages, and custom pages either had the sidebar, or did not have the sidebar. The main content div #ContentW had a 72% width when the sidebar was present, otherwise it was 96%. The problem was that I dislike having to do things manually when they can be automated through code. What I was having to do was manually add/remove page-specific classes to the css file to reflect whether the sidebar was present on that page or not.

WordPress

12 Lessons for Those Afraid of CSS

full article: alistapart.com

  1. Everything you know is wrong sort of
  2. It's not going to look exactly the same everywhere unless you're willing to face some grief and possibly not even then
  3. You will be forced to choose between the ideal and the practicable
  4. (with thanks to Antoine de Saint-Exupéry): Perfection is not when there's nothing to add, but when there's nothing to take away
  5. Some sites are steaming heaps of edge cases
  6. Longer lead times

CSS

Disqus 2012 Default Sort Order Fix

disqus default sort orderIf you are using Disqus on your site, you will see that annoyingly the default sort order for listing comments is 'best'.

I have implemented disqus on many sites and the number 1 request I get is to change the default sort order to newest.

There is no documentation or hints anywhere to solve this. So I solved it.

Javascript

Come On and Sprite for your Website

CSS Sprite, candid shotLet me show you an example that works so well I am using it right now on my site. Every page in fact. If you are a young or up and coming web developer with skills to pay the bills, lets make the future Net fast, learn about optimization and refactoring while you still have the chance.

CSS

THE Ultimate Htaccess

htaccess file .htaccess is a very ancient configuration file for web servers, and is one of the most powerful configuration files most webmasters will ever come across. This htaccess guide shows off the very best of the best htaccess tricks and code snippets from hackers and server administrators.

You've come to the right place if you are looking to acquire mad skills for using .htaccess files!

Apache, Hosting, Htaccess, Optimization, Security, SEO, Web Development, WordPress

Google Web Fonts for Programming and Code

Ok, so on a site like this one, there is a tremendous amount of 'code' styled with CSS fonts in a pre, code, var, tt, samp, or kbd html tag. When using an programming tool like VIM to write code it is shown beautifully using your OS fonts. So then, how can we get that same font beauty to be there on the web? And, of course the solution must use best-practices (and preferably only use CSS and (X)HTML).

Also, text effects! --> View Solution

CSS

Firefox Add-ons for Web Developers

askapache favorite addonsAdvanced Web Development by AskApache is a Firefox Collection I created since I'm always trying new Addons out and using multiple computers and I wanted a quick and easy way to install my favorite's and keep a running list. Firebug, YSlow, LastPass, and Web Developer are the only ones I always use regularly.

I like the idea of the last.fm but it's not as powerful as the site, which is awesome. Lately listening to Kings of Leon Radio...

Software

mod_rewrite Fix for Caching Updated Files

Web Developers sometimes use file.ext?v=004 as a version control system to force visitors to use updated files. This is terrible. Instead link to apache-003.css and set it to be cached forever. When you change the file you just change the links to apache-004.css. That eliminates millions of bandwidth and resource robbing If-Modified-Since requests. You only need Apache with mod_rewrite, and 1-10 minutes!

Htaccess

Actual Htaccess Files from My Server

#### No https except to wp-admin -
# If the request is empty ( implies fopen or normal file access by a php script )
RewriteCond %{THE_REQUEST} ^$ [OR]

# OR if the request if for wp-admin or wp-login.php
RewriteCond %{REQUEST_URI} ^/(wp-admin|wp-login.php).*$ [NC,OR]

# OR if the Referer is https
RewriteCond %{HTTP_REFERER} ^https://www.askapache.com/.*$ [NC]

# THEN skip the following rule, basically all this does is force https or badhost to be redirected
# BUT because of the above 3 rewritecond's, this won't break poorly written admin scripts
RewriteRule .* - [S=1]

RewriteCond %{HTTPS} =on [OR]
RewriteCond %{HTTP_HOST} !^www.askapache.com$ [NC]
RewriteRule .* https://www.askapache.com%{REQUEST_URI} [R=301,L]

RewriteCond %{THE_REQUEST} ^[A-Z]{3,9} /(wp-admin/.*|wp-login.php.*) HTTP/ [NC]
RewriteCond %{HTTPS} !=on
RewriteRule .* https://%{SERVER_NAME}%{REQUEST_URI} [R=301,L]

Htaccess

Getting flash to show up in front of content

Adobe Flash PositioningI used to have a problem of controlling flash elements on my sites.. On one site we have 6 different flash flv movies that are all the same size and are in the same position on the page. But only 1 is displayed at a time based on what the user wants to watch. So the selected flash movie needs to have the highest stacking order/zIndex.

CSS

Optimize a Website for Speed, Security, and Easy Management

Learn how to setup, configure, secure, optimize, and create a low-maintenance website the AskApache way. I'm piecing together all the hacks, tricks, methods, and ideas discussed throughout this blog and all across Netdom and glueing them all together to show you how to have the most optimized, crazy fastest, and best website setup I can think of.

Hosting