Содержимое рубрики «CSS»:

24 сентября 2008, 13:45

Вертикальное выравнивание внутри <li>

Если использовать списки типа <ul> или <ol> со своими картинками вместо стандартных маркеров, может возникнуть проблема с вертикальным выравниванием строк. Наглядный пример:

тут вам и ul
тут вам и li
тут вам и своя картинка

Исходник CSS:

.myul li{
list-style-image:  url('/misc/li_vert_align/bullet_info_32.png');
}

А если использовать background, то можно достичь желаемого результата:

тут вам и ul
тут вам и li
тут вам и своя картинка

Исходники:

.myul2 {
list-style-type: none;
}
.myul2 li{
background: url('/misc/li_vert_align/bullet_info_32.png') no-repeat;
margin:0;
padding:6px 0px 0px 35px;
height:24px;
}

идет под рубрикой код, дизайн, CSS | Комментариев нет

15 июля 2008, 22:00

CSS reset

Этот кусок CSS сбрасывает все стилевые значения в универсальные для браузеров. Сколько их учтено — не знаю, не нашел, но думаю, firefox и ie уж точно охвачены, а мне большего и не надо.

/* Don't forget to set a foreground and background color 
   on the 'html' or 'body' element! */
html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    line-height: 1;
    font-family: inherit;
    text-align: left;
    vertical-align: baseline;
}
a img, :link img, :visited img {
    border: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
ol, ul {
    list-style: none;
}
q:before, q:after,
blockquote:before, blockquote:after {
    content: "";
}

Оригинальная статья здесь: http://meyerweb.com/eric/thoughts/2007/04/14/reworked-reset/

идет под рубрикой код, дизайн, CSS | Комментариев нет

Всякое:

у Ника

Содержимое рубрики «CSS»:

Вертикальное выравнивание внутри <li>

CSS reset