Есть мелочи, без которых кодеру жить просто нельзя, их нужно знать, ведь пользоваться или приходиться каждый день.

Мелочь 1. Центрирование по горизонтали.
Тег <center> уже давно не декомендуется использовать, но что есть взамен?
Внутри <div> содержимое можно центрировать с помощью text-align: center, при чем центрироваться будет не только текст.

div{

text-align: center;

}

Предположим, у нас есть <div> шириной 200px и его нужно поставить по центру.
Для этого нужно в css:

div{
margin-left: auto;
margin-right: auto;
dispaly: ?
}


Пример
Мелочь 2. Центрирование по вертикали.




Еще что-то было с позишн рилейтив в ие в тестовом задании яндекса, потом как расагивать контент по вертикали когда рядом картинка, про оверфлов хидден






Затем написать как "скинить видеи плеей" и про фулскрин не забыть , смотреть примеры в агнитио, и про жесты и события в айпед

Debugger для iPad и iPhone

Для отлова ошибок разработчики Apple предоставили всего лишь debug console  - маленькую, почти ничего не говорящую и ничего не позволяющую сделать консоль. Интересно, вот сами они смогли бы работать в таких условиях? 

Для того, чтобы получать более информативные сообщения гораздо лучше использовать  Firebug lite. Полноценно работать все равно не получится из-за очень мелкого интерфейса, хотя может кто-то и приспособится...

Для того, чтобы начать пользоваться Firebug lite нужно указать путь к нему в head страницы: 

<script type="text/javascript" src="http://getfirebug.com/firebug-lite.js"></script >

После этого нижнем углу экрана появится знакомая иконка с жучком. Теперь можно просматривать DOM и выводить нормальные информативные сообщения.

Как переключать СSS при изменении ориентации экрана iPad (iPhone)

Как переключать СSS при изменении ориентации экрана (orientation change) без скриптов:
Пишем в HEAD страницы вместо <link rel="stylesheet" href="css/style.css"> :

<link rel="stylesheet" media="all and (orientation:portrait)" href="css/portrait.css">
<link rel="stylesheet" media="all and (orientation:landscape)" href="css/landscape.css">

Соответственно создаем portrait.css и landscape.css с нужными стилями. И все.

Прозрачность png в IE6

Конечно, AlphaImageLoader, а как иначе?
Обожаю это решение, работает 99%:
* html .g-png24 {
 behaviour:expression(
  (!this.fixedPNG?
   (function(el){
    var fixSrc = "", sizingMethod = "crop";
    if (el.tagName.toLowerCase() == "img") {
     fixSrc = el.src;
     sizingMethod = "image";

     el.style.width = 1;
     el.style.height = 1;
     el.src = "";
    }
    else {
     var tmpImg = new Image();
     tmpImg.src = el.currentStyle.backgroundImage.split('\"')[1];
     if (parseInt(tmpImg.width) == 1 || parseInt(tmpImg.height) == 1 || el.className.indexOf('g-png-24__scaled') > -1) {
      sizingMethod = "scale";
     }

     fixSrc = el.currentStyle.backgroundImage.split('\"')[1];
     el.className += " g-png-fixed";
    }
    el.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + fixSrc + ", sizingMethod='" + sizingMethod + "')";
    el.fixedPNG = true;
   })(this):'')
  );
 }

* html .g-png-fixed {
 background-image: none !important;
}

Как подгружать "нестандартный" шрифт

Для конвертации шрифтов я пользуюсь http://onlinefontconverter.com.
Обычно для подгрузки шрифта необходимы форматы .svg (для iPad) .otf для других браузеров.

в css сначала определяем font-face:
@font-face {
font-family: 'GeosansLight';
src: url('GeosansLight.eot');
src: local('GeosansLight'), local('GeosansLight'), url('fonts/GeosansLight.svg') format('svg'), url('fonts/GeosansLight.otf') format('opentype');
}

Можно просто так:

@font-face {

font-family: 'GeosansLight';

src: url('fonts/GeosansLight.svg') format('svg'), url('../fonts/GeosansLight.otf') format('opentype');

}

h1{

font-family: GeosansLight;

}

"src: local" - если шрифт уже установлен на компьютере пользователя, то грузить его повторно не нужно. Вообще-то можно и не проверять, а грузить сразу.

Apple Touch Gestures :)

Как запустить сайт с полнооконном режиме, так чтобы оно выглядело как iPhone приложение

Выглядет очень эффектно, когда вы можете запустить сайт, просто нажав на иконку на экране iPhone/iPad без панелей Safari.

Делается это очень просто:
1. Вставляем в HTML страницу

    <meta name="apple-mobile-web-app-capable" content="yes" />

2. Открываем Safari, заходим на сайт

3. Нажимаем на плюсик(+) в нижней панели Safari -> add to home screen

На экране рядом с другими иконками появится маленький скриншотик сайта в классичейкой айфоновской кнопочной обертке, нажав на которую получаем свой сайт с полнооконном режиме