Calculate / limit lines in textarea

I had to answer and interesting question on StackOverflow (SO): Can can you limit (well, first of all calculate, of course) the number of lines in a textarea?

A little help with Internet Explorer Compatibility Mode

We all know that Internet Explorer 7 and 8 don't always play very well with all websites, so Microsoft has introduced Compatibility Mode for Internet Explorer. While building a new website just now, I stumbled upon a very good article about what Internet Explorer Compatibility Mode is all about. The article titled Understanding Compatibility Modes in Internet Explorer 8 explains it very well. I used the meta tag with "IE=edge" that asks the browser to "Always use the latest standards rendering mode". You might also want to refer back to one of my old posts to find out how to cheat Internet Explorer to do different stuff than other browsers: Internet Explorer CSS "cheats".

Edit style of active page of your navigation menu

When building a website, it is crucial that visitors can easily navigate and know as to which page they are currently on. You may solve this by making the title of the page to stand out (like I did on this blog) or, the other way, it is actually recommended to use both if possible, you could style (eg. give a different colour to) the name of the currently visited page in the navigation menu.

New website 'in the house': widosub.com & V2 Manufacture updated

Was just ready a few days ago with the latest, very simple website i created for an amazing musician and dj, widosub. I created his site with WordPress and used the The WordPress XSPF Player Plugin, a Flash based music player plugin. Go ahead and check it out now: widosub.com.

I also made a recent change to V2 Manufacture: due to the fact that the client wanted to see the website through iPad and iPhone, I had to replace the Flash based simpleviewer script by a Javascript based picture gallery tool. I used the probably simplest and awesomest script called Galleria by Aino. As a backup solution, for those who have difficulties seeing javascript content, I created a separate, simple, html/css based version of the picture gallery - I used a simple CSS photo-album for this replacing the numbers with thumbnail pictures.

CSS Equal Height Columns

While looking for a solution for the thread called "background repeat of the left cotainer based on middle container" on the WebMasterWorld Forum I automatically thought of using tables. It is definitely the easiest but its browser support is not the best (see Seven Reasons to go Table Free).

'Marquee or not marquee' or 'How to scroll text in HTML?'

The question could also be: should marquee be used as an element or as a css property?

Before I would elaborate on that, let me just give an example to the ones who have no idea what marquee means. This is basically an element or css property (see below which one is which) that allows you to make a simple text (or even image) scroll in a specified direction with a specified speed.

CSS Preload images (hover backgrounds)

While building a one page site with many images on it as buttons to click (div backgrounds), I realized that the hover picture takes some time to load and I can imagine what that could mean for someone who has slower connection. What happens in this case is that if you hover over an image, it will not display the hover background image for some time, so you'll just see a white space instead of the image.

How to add sidebar (widget) placeholder in Wordpress

I didn't find too many posts on Google about this, so I thought I'm going to help you guys to add sidebar (widget) placeholder in Wordpress; it's really so simple:

1 Register your sidebar

Simply open your template's functions.php (by default it's wp-content/themes/[yourtheme] - where [yourtheme] is the folder name of your theme):

How to change style of Wordpress, Joomla!... CMS's

While it took me some time to find the best practice, I'm going to provide you with the easiest and fastest way to style your CMS (Wordpress, Joomla!) template, it is very simple actually: just open your blog / website with the template, look at the source code (you'll find an option 'View Source Code' or something similar in most of the browsers right-clicking anywhere on the page), locate the id's and classes you would like to modify, then go ahead and make a source code (or in file text) search among the template files (preferably .css) for the specific id or class name and change it as you please.

CSS Uppercase / All Caps - a one liner

Well, I never really needed it, but then I did so I looked it up quickly and found this post about CSS Uppercase / All Caps. Easy-peasy :)

Fixed DIV at the bottom of a page

Ever wondered how they make it on those websites where there's a menu or options always sticking to the bottom of the page? Well, i was, so I digged a bit and found this thread: Create a fixed DIV at the bottom of a page even if the page scrolls just like Facebook's bottom menu..

It's amazing how many things you can actually do with CSS without actually having to use any script, isn't it?

background image overlap using negative (minus) margins

I fell in love with a menu style so I thought I'm going to do it myself. What I really liked about it was not only the rounded style but also that it seemed to overlap to the image above. With the very comprehensive help of The Definitive Guide to Using Negative Margins I managed to do it just the way I wanted.

See a snapshot of the part I was talking about:

How to upload a Joomla! website's localhost version to my hosting server

Note: this article assumes that you use XAMPP to test your website offline - see one of my eariler articles about it here. The first suggested installation method of the Absolute Beginners Guide to Joomla! is XAMPP too.

How to add line breaks into a textarea

I use the textarea tag when I include code into my posts, but I wasn't able to figure out a way to add a line break in there as the <br/> tag would be displayed in a textarea instead of actually breaking the line. Well, as I could find out through the article Adding/Insert Line Breaks into a Textarea the key is to add this 'code' instead: &#13;

It's tiny but can be really annoying if you don't have the information. ;)

Stretch a background image

Well, yeah, I thought it might be useful for your website building efforts, so I looked up articles about stretching a background image and this is what I found:

- short version: How do you ... stretch a background image?
- long (detailed) version: How Do you Stretch a Background Image in a Web Page

Check out my blog for example, doesn't it just look so great? :)

Form in tooltip with text linked send button

While continuing to work on gergomatis.com I needed to find a simple contact form, something that fits the minimalist design of the site. I was spending a very long time with searching and I thought this was only possible with JavaScript [one of the simplest examples: Help Writing An Html Code (onclick Open Something)], but then I found exactly what I needed. No JavaScript, no complicated coding, a simple CSS rule is enough:

Use your own fonts on your website

Wanna use your own fonts on your website? Check out this interesting article about Html Document Fonts

Honestly, I haven't tried this, I find it too complicated, only recommended if it's absolutely important that you have a sepcific font on your website.

CSS and round corners: Borders with curves

Rounded corner tables are very much in style these days and honestly, I love (and also use) them a lot. You'll find an excellent description as to how to create them at WebCredible - CSS and round corners: Borders with curves.

Currently I'm doing it by splitting the table into 3 rows and place a picture with the upper left and right corners and the top part of the border together in one picture at the top and repeat the same at the bottom. The part in between is colored the same as the top and bottom border pics. However, the mini-genious about the solution in the linked article is that in that way the table border will always automatically follow the width of the text within the table.