Новая версия, оптимизированная, с исправленными багами. Немного обновлён интерфейс. Теперь на английском языке.
ВНИМАНИЕ: в ближайшем будущем будет изменена структура MySQL таблиц, для долговременного использования лучше подождать следующий релиз.
Живой пример работы: http://hash.ziggi.org/
GIT: https://github.com/ziggi/deHasher
В Интернете полно информации по выравниванию div’а по центру с помощью CSS, однако я не нашёл способов, которые бы всегда работали. Решил написать свой, получился плагин для jQuery.
$('#mydiv').center();
parent - относительно чего будет выравниваться элемент(пример: 'body', '#middle').
position - присваиваемая позиция, по умолчанию absolute
options - тип выравнивания: 'all', 'height', 'width', по умолчанию - 'all'
(function($){ $.fn.center = function(parent, position, options) { return this.each(function () { var self = $(this); self.css('position', (position != null) ? position : 'absolute'); if (parent == null) { width = self.parent().outerWidth(); height = self.parent().outerHeight(); } else { width = $(parent).outerWidth(); height = $(parent).outerHeight(); } if (self.parent().is('body') || parent == 'body') { width = $(window).outerWidth(); height = $(window).outerHeight(); } dwidth = self.outerWidth(); dheight = self.outerHeight(); if (options == 'width' || options == 'all' || options == null) { self.css('left', (width - dwidth) / 2); } if (options == 'height' || options == 'all' || options == null) { self.css('top', (height - dheight) / 2); } }); }; })(jQuery);
Теперь буду выкладывать свою CSS графику. Это серая кнопка, с градиентом, под все браузеры.
<button class="zgshell">Пример</button> <a class="zgshell">Кнопка</a>
.zgshell { padding: 7px 15px; border: 1px solid #aaa; background: #888; background: -webkit-linear-gradient(top, #888, #666); background: -moz-linear-gradient(top, #888, #666); background: -ms-linear-gradient(top, #888, #666); background: -o-linear-gradient(top, #888, #666); background: linear-gradient(top, #888, #666); margin: 0; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ie-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; color:#fff; text-align: center; text-shadow: 0 -1px 0 #555; font-weight: bold; font-size:13px; cursor: pointer; outline: none; text-decoration: none; } .zgshell:hover { background: #777; background: -webkit-linear-gradient(top, #888, #777); background: -moz-linear-gradient(top, #888, #777); background: -ms-linear-gradient(top, #888, #777); background: -o-linear-gradient(top, #888, #777); background: linear-gradient(top, #888, #777); } .zgshell:active { background: #666; background: -webkit-linear-gradient(top, #666, #888); background: -moz-linear-gradient(top, #666, #888); background: -ms-linear-gradient(top, #666, #888); background: -o-linear-gradient(top, #666, #888); background: linear-gradient(top, #666, #888); }