Архив

Публикации с меткой ‘css’
3 октября 2018 Нет комментариев

Пример на less:

.zoom(@zoom){
	zoom:@zoom;
	-ms-zoom:@zoom;
	-webkit-zoom:@zoom;
	-moz-transform:scale(@zoom,@zoom);
	-moz-transform-origin:top center;
}
img{
	.zoom(.7);
}
Categories: CSS Tags: ,

Когда шрифты с https://fonts.google.com/ нужно сохранить и использовать локально.
Для загрузки шрифтов и генерации css воспользоваться сервисом:
https://google-webfonts-helper.herokuapp.com/

Categories: Web Tags:
9 февраля 2018 Нет комментариев

Рамка с уголком посредине в центре (less):

.block{
	background:@color_white;
	border:1px solid @color_gray;
	.border_radius(5px);
	padding:10px;
	&:before,&:after{
		content:'';
		position:absolute;
		left:50%;
		margin-left:-10px;
		top:-20px;
		border:10px solid transparent;
		border-bottom:10px solid @color_gray;
	}
	&:after{
		border-bottom:10px solid @color_white;
		top:-19px;
	}
}

http://htmlbook.ru/blog/treugolniki-cherez-css

Categories: CSS Tags: ,
22 января 2018 Нет комментариев
$('.popup').fancybox({
	helpers:{title:null},
	padding:'0',
	width:'800',
	beforeShow:function(){
		$('input.date').datepicker({
			//options
		});
	}
});
#ui-datepicker-div{
	z-index:9999 !important;
}
Categories: CSS, Javascript Tags: ,
12 января 2018 Нет комментариев
body{
	-ms-text-size-adjust:100%;
	-moz-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
}

Mobile Safari (а также Chrome для Android, Mobile Firefox и IE Mobile) автоматически увеличивают размер шрифта внутри широких блоков.

Минус этого решения:
Двойной тап по блоку больше не будет увеличивать его масштаб в рамках ширины экрана.

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

https://ru.stackoverflow.com/questions/382661/Почему-ios-safari-увеличивает-шрифт

Categories: CSS Tags: , ,
19 декабря 2017 Нет комментариев

Чтобы убрать закругленные углы и другие стандартные стили Safari:

-webkit-appearance: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
Categories: CSS Tags:
23 ноября 2017 Нет комментариев

В примере таблицы в контенте расположены внутри тега article

$(document).ready(function(){
	$("article table").wrapAll('<div class="contenttable"></div>');
});
article .contenttable{
	overflow-y:auto;
}
Categories: Web Tags: ,