A bit about

Hello, everyone! All you can see below is just my bank of information. Some material I've found in the fathomless net, some I've learned myself. Don't think all of the information here is right or actual, but may be it could be of use for you :) All feedback is welcome, especially constructive ones :)

Thursday, April 23, 2009

HTML: 1-pixel horizontal line

<div> element is quite useful for creating 1-pixel width horizontal lines on Web page. For example, we can use empty DIV container and than write the following CSS style:
.separator {
height: 1px;
width: 90%;
display: block;
background-color: #555555;
margin-left: auto;
margin-right: auto;
}

This works fine everywhere except IE6. It creates a horizontal line with minimum width equal to the current font size:

The hack for IE6 is adding empty comment to the div:
<div class="separator"><!----></div>

The result is the same in all browsers:


P.S. "font-size: 1px" doesn't do the trick because, all the same, the resulting line is 2px or something

Thursday, April 9, 2009

HTML: align="center" through CSS

If you need to center one element inside another block element (for example TABLE inside a DIV element) you can use align="center". For example:
<div>
<TABLE width="50" align="center">
...
</TABLE>
</div>

But if you need to use CSS you can do this:
table {
margin-left: auto;
margin-right: auto;
# or just margin: 0 auto 0 auto;
}