css3- все статьи тега ➜ страница 6
переполнение-й версии Firefox не работает с вложенными основе
Я разработал макет 100% ширины 100% высоты с css3 flexbox, который работает как на IE11 (и, вероятно, на IE10, если эмуляция IE11 правильна). но Firefox (35.0.1), overflow-y не работает. Как вы можете видеть в этом codepen : http://codepen.io/anon/pen/NPYVga firefox не отображает переполнение правильно. Он показывает одну полосу прокрутки html, body { height: 100%; margin: 0; padding: 0; border: 0; } .level-0-container { height: 100%; display: -webkit-box; di ...
Перекрывающиеся круги в CSS с 1 div
Я ищу, чтобы создать эту форму перекрывающихся кругов в CSS: в основном, просто сложенные круги. Я посмотрел вокруг, и все решения, которые я вижу, включают в себя использование нескольких элементов div для этого эффекта. Однако, не может ли это быть сделано с помощью одного div, используя CSS3? Я посмотрел, как это можно легко сделать, и понял, что, если все цвета одинаковы, у вас будет форма таблетки, например это: http://jsfiddle.net/5wytm0r4/ #circles { background-color: red; ...
Вертикально повернутый по центру текст с CSS
у меня есть следующий HTML: <div class="outer"> <div class="inner rotate">Centered?</div> </div> div.outer узкая вертикальная полоса. div.inner поворачивается на 90 градусов. Я хотел бы текст " по центру?"появляются по центру в div-контейнера. Я не знаю размер любого div заранее. это близко: http://jsfiddle.net/CCMyf/2/. вы можете видеть из jsfiddle, что текст вертикально центрирован перед transform: rotate(-90deg) стиль применяется, но несколько смещается после. ...
CSS media query для таргетинга только на iPad и iPad?
Привет я работаю с несколькими планшетными устройствами, iPad, Galaxy Tab, Acer Iconia, LG 3D Pad и так далее. iPad-1024 x 768 LG Pad-1280 x 768 Galaxy Tab-1280 x 800 Я хочу, чтобы целевой iPad только с помощью CSS3 media query. Поскольку ширина устройства LG и iPad одинакова 768px-у меня возникли проблемы с разделением каждого устройства. Я пробовал следовать, чтобы отделить, но, похоже, нет рабочий: @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orien ...
Может ли CSS3 переход размер шрифта?
как можно увеличить размер шрифта при наведении мыши? Цветовые переходы прекрасно работают с течением времени, но размер шрифта переключается сразу по какой-то причине. пример кода: body p { font-size: 12px; color: #0F9; transition:font-size 12s; -moz-transition:font-size 12s; /* Firefox 4 */ -webkit-transition:font-size 12s; /* Safari and Chrome */ -o-transition:font-size 12s; transition:color 12s; -moz-transition:color 12s; /* Firefox 4 */ -webk ...
Как установить столбец фиксированной ширины с помощью CSS flexbox
CodePen:http://codepen.io/anon/pen/RPNpaP. Я хочу, чтобы красный прямоугольник был шириной всего 25 ЭМ, когда он находится в бок о бок-я пытаюсь добиться этого, установив css внутри @media all and (min-width: 811px) {...} до .flexbox .red { width: 25em; } но когда я это делаю, это происходит: http://i.imgur.com/niFBrwt.png есть идеи, что я делаю неправильно? Большое спасибо. ...
Бутстрап 3 не удается отобразить glyphicon правильно
Я мигрирую из bootstrap 2.3 в bootstrap 3, и все работает хорошо. Но когда я попытался добавить некоторые значки, шрифт значка не отображается должным образом. Я попытался посмотреть сюда http://bootply.com/61521 и только '.glyphicon-конверт был отображались должным образом. Другие отображаются как "E001" и так далее. Как я могу решить эту проблему? для других браузеров глифики отображаются правильно, только firefox был недоступен покажите его правильно. ...
CSS3 свойство webkit-переполнение-прокрутка: ошибка касания
iOS 5 выпустила веб-дизайнеры новое свойство -webkit-overflow-scrolling:touch который использует аппаратный ускоритель устройств iOS для обеспечения собственной прокрутки для прокручиваемого div. при реализации на наш сайт в разработке, он работает, но не очень хорошо. Я считаю, что может быть проблема CSS, поэтому я спрашиваю здесь. следующее скрипка покажет вам, что он работает отлично Если вы перейдете на наш сайт в разработке, вы найдете ту же панель под объектами вкладка, но на iOS, хот ...
Непрерывное вращение CSS анимацию при наведении, анимация вернуться к 0deg на Ховер из
У меня есть элемент, который вращается при наведении на него бесконечно. При наведении указателя мыши анимация останавливается. Просто: @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } .elem:hover { -webkit-animation-name: rotate; -webkit-animation-duration: 1.5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; } при наведении курсора мыш ...
Поместите текст в нижней части div
У меня есть 4 DIV рядом друг с другом, и все они сосредоточены в середине экрана. У меня есть 2 слова в каждом div, но я не хочу, чтобы они были вверху, я хочу, чтобы они появлялись в нижнем правом углу div. Как я могу это сделать? ...
Как перекосить элемент, но сохранить текст нормальным (unskewed)
можно ли воспроизвести это изображение, используя только CSS? Я хочу применить это к моему меню, так что коричневый фон появляется на hover экземпляр Я не знаю как это сделать, я только; .menu li a:hover{ display:block; background:#1a0000; padding:6px 4px; } ...
Как сбросить CSS3 * - transform: translate(...)?
как я должен сбросить ранее примененные преобразования CSS? скажем, у меня есть: div.someclass { -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate(0, -50%); -ms-transform: translate(0,- 50%); -o-transform: translate(0, -50%); transform: translate3d(0, -50%, 0); } тогда как я могу очистить все преобразования / переводы? должен ли я использовать:translate(0, 0);/translate3d(0, 0, 0);илиtransform:auto; ? ...