Имею очередной околовебный вопрос .)

Кто-нибудь знает, как в Expression Web 3 поставить UTF-8 кодировкой по умолчанию?
А то больно уж ANSI надоела .)

ps. Баронесса, сладкое вознаграждение отправлено по назначению ,)

Upd = полурешение.
В каждом файле, кт требуется сохранить именно в UTF-8, где-нибудь сверху нужно вставить:

<!-->
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<!-->

Полурешение = потому что хочу всё автоматически, а не ручками.
К тому же, лечить один баг другим багом = как-то цинично .)

Никаких картинок, чистый CSS:
http://desandro.com/articles/opera-logo-css/
Снимаю шляпу.

Please please, need help.
Голова совсем уже отказывается думать самостоятельно, а css нужно доделать.

Дано:

<div id="a">
<div id="b"> </div>
<div id="c"> nani nani </div>
<div id="d"> </div>
</div>

#a = width:400px; height:100px;
#b = width:100px; height:100px;
#c = width:200px;
#d = width:100px; height:100px;

Задача:
Выстроить блоки в линейку друг за дружкой, при этом текст в блоке #c должен быть выравнен вертикально по центру относительно блоков #b и #d.
Высота блока #c > 0px и <= 100px (т.е. вне зависимости от количества символов, текст должен быть строго по центру).

Кто подскажет решение = подарю чоколадку .)

Ушла переустанавливать ос. Надеюсь, что вернусь .)

Господа работающие, оч нужен ваш совет.

Условия:
1. Имеется компания “Nani Nani”, в которой вы жуть как хотите работать.
Кем = выбирайте сами = маляром, дизайнером, программистом, топ-менеджером = не важно.
2. У “Nani Nani” уже есть маляр/дизайнер/программист, начальство вполне им довольно, и живут они спокойно и мирно.
3. Вы знаете, что этот-мальчик/эта-девочка вытворяют какую-то чушь и как специалисты мало что из себя представляют. Это объективное условие, а не ваше самомнение, прошу отметить. Так вот вы знаете, что сможете выполнить эту работу гораздо круче, при этом начальство будет в шоколаде от того, что у них в команде появится профи.
4. С логикой у вас полный порядок. Объяснить, чем именно вы лучше, и кто от этого выигрывает, сможете доходчиво.

Ситуация:
Приходите вы в “Nani Nani” на собеседование.
Перед вами сидят начальство + тот-самый-мальчик (ещё в должности, но недолго ему жить осталось .)
И вот начальство спрашивает: “А почему вы считаете, что наш сотрудник не справляется?”.
И вам нужно, глядя мальчику в глаза, сказать, что он полный идиот, и всё время, что тут работает, водит начальство за нос.
Само собой, мальчик вас молча слушать не будет, да и вообще он уходить из “Nani Nani” не намерен.
Соответственно, вам в ответ будут доказывать, что вы = выскочка и вообще не профессионал.
А начальство будет сидеть и всё это слушать...

Вопрос:
Как бы так хитро и тактично ответить на вопрос “А почему вы считаете...”, чтобы и себя в лучшем свете выставить, и мальчика не оскорбить, и перед начальством предстать эталоном мудрости и неконфликтности?
А?

Мне нельзя говорить, что шрифты = головная боль веб-дизайнеров.
Потому что (по-честному) это не так.
Прошли времена, когда ради красивого оформления вместо текста подставляли картинки.
Сейчас CSS позволяет вытворять с буковками такие штучки, что остаётся только радоваться и хлопать в ладоши.

Итак, 3 приёма, кт стоит помнить наизусть.

#01. Импорт

@font-face {
 font-family: "Nani";
 src: url('Nani.otf');
}

body {
 font-family: Nani, "Helvetica Neue", sans-serif;
}

Что видим: сначала мы указываем название шрифта и адрес, по кт он располагается → затем применяем его в CSS, как любой другой.
В зависимости от размера шрифта, подгружаться будет много или мало секунд .)

У этого же трюка есть более крутой вариант:

@font-face {
  font-family: 'Nani';
  src: url('Nani.eot');
  src: local('Nani Regular'), local('Nani'), 
         url('Nani.otf') format('opentype');
}

В отличие от первого, эта штучка сначала ищет нужный шрифт на пк, и уже если не находит, тогда да, загружает.
Подробнее на CSS-Tricks (>>)

#02. Поворот

.rotate {

/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

Это = наикрутейшая штуковина ever.
Она поворачивает текст хоть по диагонали, хоть вверх тормашками.
Угол поворота задаётся в градусах, что полностью развязывает руки.
Для IE значение = целое число от 0 до 3, где 0 = 0°, 1 = 90°, 2 = 180°, а 3 = 270°.
Искать на том же CSS-Tricks (>>)

#03. Тени

/* Одна штука схематично*/
p { text-shadow: Q W E R; }

/* Две штуки конкретно */
p { text-shadow: 1px 1px 1px #000, 3px 3px 5px blue; }

/* Как вариант можно указать RGBA цвет */
p { text-shadow: 0px 2px 2px rgba(255, 255, 255, 0.4); }

Спорный, но интересный приём.
Для каждой тени задаём четыре значения:
Q = длина тени по оси X (читай: горизонтально);
W = длина тени по оси Y (читай: вертикально);
E = радиус размытости;
R = цвет.
Всё тот же CSS-Tricks (>>)

Вот.
Вопросы?

Не завидую я веб-дизайнерам.
Они каждый день принимают жестокие решения: сделать сайт красивым для глазок или доступным для поиска.
И гугл ну никак не хочет входить в их положение.
Вместо этого только и делает, что придумывает всякие глупые разности.
Взять хотя бы верхушку верхушек любого сайта = лого.

Вопрос: Как подставить графическое изображение логотипа в хэдер?
Условие: It should be SEO perfect.
Самое распространённое решение (достаточно удобное, между прочим):

<h1>nani nani</h1>

h1 {
background: url('nani.png') no-repeat;
text-indent: -99999px;
}

Что имеем: text-indent смещает наш текст бесконечно далеко за пределы экрана, а место, для него предназначенное, занимается фоновой картинкой = собственно нашим лого.
Для убедительности можно прописать в цсс width + height + display: block.

В чём подвох?
Дело в том, что гугл засчитывает text-indent: -99999px за спам.
И хотя я считаю это милой чушью, официальная точка зрения такова:



К слову, по оригинальной ссылке есть ещё и несколько интересных комментариев, общий смысл которых = “Они совсем там уже обнаглели”.
Вот.

Решали с доком веб-задачку, кт не даёт мне покоя уже продолжительное время.

Требуется:
Стандартный 3-column design = 3 колонки вида sidebar1 — main — sidebar2, расположенные по центру.

Условия:
× index.html = XHTML 1.0 Strict;
× style.css = CSS 2.1;
× расположение в коде = main — sidebar1 — sidebar2.

Данные:
× sidebar1 = 100px;
× main = 300px;
× sidebar2 = 200px.

( Решение )

Кто даст другое решение = hero of the day .)

Это, конечно, не моё дело, зачем вам понадобились закруглённые углы.
Я лично этот вебовский манёвр не оч люблю.
Но один милый приёмчик знаю.

Задача: получить красивенький закруглённый штук (рамку, меню, хэдер, блок = не важно).
Условие: использовать только CSS, никаких открытых и скрытых ссылок на изображения.
Решение: штука под названием border-radius.
Подвох: работает с Firefox + Safari + Chrome. В Опере + IE этой номер не прокатит.
Пример:
Допустим, у нас на страничке есть объект, стилем которого мы управляем с пом тега <nani></nani>.
И вздумалось нам закруглить у этого объекта левый верхний угол, прям как у Jetlag Digital на лого.
В файле style.css должно быть прописано следующее:

nani {
    -moz-border-radius-topleft: 10px;
    -khtml-border-top-left-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    border-top-left-radius: 10px;
}

Объясняю значение каждой строчки.
border-top-left-radius = стандартный код, который по-хорошему должен работать в CSS3. Ключевое слово = “по-хорошему”.
Тк веб развивается куда быстрее, нежели браузеры, не все стандарты ещё являются стандартами, т.е. функция в теории есть, но на практике её поддерживают далеко не все.
Префикс -moz заставляет наш приём работать в Мозилле, -webkit = в вебкит-браузерах (Сафари, Хром), ну и -khtml, соответственно, = khtml-браузеры (Konqueror).

Обращаю внимание на синтаксис:

border-radius = -moz-border-radius = -webkit-border-radius = -khtml-border-radius
border-top-left-radius = -moz-border-radius-topleft = -webkit-border-top-left-radius = -khtml-border-top-left-radius
border-top-right-radius = -moz-border-radius-topright = -webkit-border-top-right-radius = -khtml-border-top-right-radius
border-bottom-left-radius = -moz-border-radius-bottomleft = -webkit-border-bottom-left-radius = -khtml-border-bottom-left-radius
border-bottom-right-radius = -moz-border-radius-bottomright = -webkit-border-bottom-right-radius = -khtml-webkit-border-bottom-right-radius

10px, само собой, меняете на то, что вам нужно.
Вроде всё.

Ещё один web-тренд.
Называется так:
a:visited { text-decoration:line-through;}
В определённых случаях оч полезная штука.