Centering a div horizontally
It will make the inner element center horizontally and it works without setting a specific width.
Working example here:
#inner {
display: table;
margin: 0 auto;
}
<div id="outer" style="width:100%">
<div id="inner">Foo foo</div>
</div>
Source:
http://stackoverflow.com/a/114549
http://stackoverflow.com/questions/114543/horizontally-center-a-div-in-a-div?rq=1
Bootstrap snippets
http://vk.cc/520GR8
- как сделать зафиксированный фон, кот. работал бы на iOS.
Fixed backgrounds with background-size: cover in iOS with Bootstrap 3.
http://vk.cc/521Hr8
(http://codepen.io/j_holtslander/pen/eJwEMg)
- 'tasty box' landing page
http://codepen.io/j_holtslander/pen/BKaXWw
- SVG image going to navbar on scroll.
Using scrollr library.
http://codepen.io/j_holtslander/pen/mVZqmm
- centering.
A demo on horizontal and vertical centering.
The title appears with animation, from below, 'bounceUp'.
http://vk.cc/52qVof
[ http://codepen.io/j_holtslander/pen/GJwMEK ]
- multiple navbars in Bootstrap 3.
http://vk.cc/52syEO
http://codepen.io/j_holtslander/pen/waQQYm
- 'Fancy fixed Bootstrap navbar.'
A navbar that starts down low and becomes fixed-top.
- Doesn't work in iPad!
http://vk.cc/52qVQ3
[ http://codepen.io/j_holtslander/pen/MwdObK ]
- navbar under the heading in Bootstrap 3.
http://vk.cc/52qM6o
[ http://codepen.io/j_holtslander/pen/pgXrWj ]
- several navbars in Bootstrap 3.
http://vk.cc/52ivUq
[ http://codepen.io/j_holtslander/pen/Jdwjpj ]
- Заголовок уходит в navbar, меняющий цвет при прокручивании. Красиво!
- Doesn't work in iPad!
http://codepen.io/j_holtslander/pen/yeEZez
- Список. Слева - миниатюра, справа - описание. Реализация на Bootstrap.
http://codepen.io/j_holtslander/pen/ZGZwJz
- Bootstrap 3 bio thumbs with social overlay on hover
http://codepen.io/redfrost/pen/mzHjb
- Bootstrap 2 moving box carousel
Движется само!
Freezing a tooltip (popup or modal) to edit CSS in Developer Tools window
To freeze a popover while shown or a modal window or a tooltip in hover state, or any other element that appears in hover state:
- F12 - to open a console.
- Hover over the element, the tooltip will appear.
- Alt+TAB to switch to the "Developet Tools" window.
- Go to Sources and press F8 there. The current state will freeze.
- Return to the tooltip and work with CSS.
Остановить кеширование CSS в WP
http://habrahabr.ru/post/163871/#comment_5637749
Чтобы обойти кеширование и в то же время иметь версию в имени файла придумано достаточно изящное решение в .htaccess
# анти-прокси-кэширование стилей
# style.v123.css -> style.css
RewriteRule ^(.*)∖.v[0-9]+∖.css$ $1.css
RewriteRule ^(.*)∖.v[0-9]+∖.js$ $1.js
* * *
Другой вариант противостояния кешированию. В строке подключения css файла, в атрибуте href после имени файла пишем “?v=версия_файла”.
Пример:
<link rel="stylesheet" media="all" href="..css/style.css?v=1" />
Браузер запоминает этот параметр, и проверяет его при каждом посещении сайта. Если версия файла изменится, стили перезагружаются.
P.S.
Кажется, этот метод не работает. Ищем другой.
Вот ещё два решения:
1.
http://charliepark.tumblr.com/post/5998700883/cache-busting-the-wordpress-stylesheet
"So, I just add a timestamp to the end of the CSS file … exactly how Rails (up to 3.1) did.
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>?<?php echo time(); ?>" />
By adding the last part of that string (?<?php echo time(); ?>), it means that the CSS file is fetched new on each pageload."
2.
http://wordpress.stackexchange.com/questions/5116/cache-busting-css-files-other-than-style-css
(Последний метод, внизу, вроде, доступен.)
Move sidebar to the left in Twenty Twelve, WP 3.5
http://wordpress.org/support/topic/move-main-sidebar-in-twen ty-twelve
Twenty Twelve, default theme in WP 3.5.
This code moves sidebar to the left.
Child theme CSS.
--
/*-- move sidebar to the left --*/
@media screen and (min-width: 600px) {
.site-content {
float: right;
}
.widget-area {
float: left;
}
}
/* for IE8 and IE7 ----------------*/
.ie .site-content {
float: right;
}
.ie .widget-area {
float: left;
}