HTML & XHTML

Various important things I noticed when writing HTML & CSS code.

HTML

Forms

If you use the GET method on a form, on the action URL, don't give an URL already containing variables encode in GET style. The browser will just rebuild the URL when you submit the form, and thus the variables will be ignored. Eg, something like:

<form action="myurl.html?myVariable=yes&myCounter=3" method="GET"><button type="submit></button></form>

won't work. If you want to pass variables and use a GET method, just create hidden input fields.

CSS

Margins, paddings and borders on a table

Margins don't seem to work at all with table elements (it would work with the table itself, though). Paddings seem to work only with elements, not . So the recommended way to specify spacings between elements in a table is through the specific 'border-spacing' property. Note that this property should be applied to the table element, not the . Note that the border property, specifying the border of the cell, should be on the contrary applied to each cell, like this:

table.with_borders td {border: 1px solid black; padding: 3px;}

If you write this, borders will have in fact most of the time 2 pixels, because the borders will not be merged between two cells. If you want them to merge (and thus always have only 1 pixel), use border-collapse: collapse; in your table element.

You can specify certain properties to be applied to an entire column in a table (for exemple the 'border' property). However not all properties can be such applied, apparently. For example, I don't know how to apply the text-align property to an entire column (or if it is even possible).

Selectors

To apply an "AND" on a selector in CSS (for example, to apply a style to elements belonging to two classes), just repeat the normal selector, like this:

*.first_class.second_class

This would probably also work on class and ID, etc (untested yet):

*.first_class#my_id

To select every column in a table except the first one, use the following selector:

tr td + td

To eliminate the first row from the selector, just add tr +:

tr + tr td + td