Z1gnet

да что тут объяснять? все просто работает. вы растянули сильно растянули .content, внутри блоки у которых задан display:inline-block выровняли по центру с помощью text-align:center. по сути это выровненный текст по центру

если у div[class*=-view] .row убрать display: flex; то в хроме все становится нормально

спасибо. но это не совсем то. в вашем примере все завязано на max-width на центральном блоке. а я его не знаю. оно может быть как 500рх, так и 800рх, в зависимости от ситуации. вообще-то я могу легко сделать все пункты которые описал, но не будет троеточия в конце. а если будет троеточие, то будут другие баги... короче походу придется костылять и надеяться что не развалится

http://codepen.io/Z1gnet/pen/aOBYvK

Всем привет. Столкнулся с такой проблемой

http://take.ms/7rC84есть конструкция из 3х частей. все три могут динамически менять ширину. изначально должно все выглядеть как на скрине выше, тоесть растягиваться на ширину контента блоков. при изменении контента все должно красиво тянуться, вот так - http://take.ms/MOUFg

тут все ясно, куча вариантов реализации... но дальше начинается веселье. важно что здесь текст должен быть только в одну строку.

при достижении ширины родительского блока наша конструкция должна перестать увеличиваться в ширине (ну типа max-width:100%) и в центральной колонке текст который не влазит должен обрезаться и ставится в конце троеточие, типа так - http://take.ms/LCpGk

на первый взгляд простая задача, но не так все просто как казалось. перепробовал кучу вариантов (таблица, инлайн-блок, флоат) но всегда какаето бочина вылазит. с таблицей либо вылазит за пределы родительского блока, либо , если поставить table-layout: fixed, крайние колонки тоже растягиваются, а они должны быть по ширине контента.

возможно кто-то подскажет красивое решение.  решение нужно на цсс, без всяких скриптов. браузеры самые последние.

всем спасибо.

Как только запостил тему сразу и баг пофиксил))) кнопку твиттера обернул в див и задал стили

.twitter-follow{    overflow: hidden;    position: relative;}

проблема решилась. тему можно закрывать

А как можно пофиксить проблему, не имею кода? Может у вас неправильно свёрстано?

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

Всем привет. Столкнулся с такой проблемой: добавляю на сайт кнопку follow twitter отсюда https://about.twitter.com/resources/buttons#follow. но при загрузки страницы в момент когда грузится скрипт твиттера появляется скролл (это можно увидеть если кнопку добавить в нижний правый угол). скролл появляется буквально на секунду и пропадает. я уже пытался обернуть в див и задать overflow: hidden. не помогло. кто знает как пофиксить данную проблему?

Спасибо

высота оставалась по ширине экрана

как-то тут все закручено...

поставте ширину на иконку

http://cssdeck.com/labs/cfpzrp2z

http://take.ms/sYOVkвот зачем

<p><a name="lst1"></a></p> замени на <p><a id="lst1"></a></p> и <span class="d_center">   на <div class="d_center">  

немного поправил скрипт. теперь нормально работает http://codepen.io/Z1gnet/pen/RPWzze

только теперь не #pagination, а .pagination вместо айдишника класс (для валидности)

проблема в нижнем отступе? пропишите font-size: 0; на ul и он пропадет

http://jsfiddle.net/gt39prfs/2/ вот так работает. проблема в том что div.block изначально блочный, то есть растягивается на всю допустимую ширину. и получается что вы отнимаете от ширины родителя ширину .block, но она равна ширине родителя. потому у вас левый отступ и получается 0. я вынес присвоение абсолюта немного раньше и все заработало как надо.

Всем спасибо за ответы)

Всем привет! Столкнулся с такой проблемой:

У меня есть блок у которого задан position:fixed; left:0; top:0. и он у меня прилип к углу экрана браузера. но вот если родителю этого блока задать трансформ, например, transform: translateX(0), даже нулевой, то фиксед начинает считать не от экрана браузера, а от блока с трансформом. Никогда с таким не сталкивался, кто-то может объяснить почему он себя так ведет и как этом можно пофиксить.

Набросал мини примерчик http://codepen.io/Z1gnet/pen/VYOxGG

http://take.ms/Ha45S воу, что это за BR? кто ж так будет текст вбивать? в любую строку дописываю текст и все падает. надо ширину задать на .from-the-blog

вам тут нужна сетка. что-то типа бутстрапа http://getbootstrap.com/css/#grid

можете свою составить с нужными вам размерами

так не пробовали?

http://jsfiddle.net/88bh68v3/

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

как вариант http://jsfiddle.net/q1bxcb9u/1/

во-первых вашу запись можно сократить и вообще вы дублируете одни и те же  стили.

 background-color: #3aad8b !important;    border: none !important;    background: url('/static/images/appointment.png') 40% 40% no-repeat;    background-position: right top;

это можно сократить до

 border: none !important; background: #3aad8b url('/static/images/appointment.png') right top no-repeat;

ну и картинка через :after http://codepen.io/Z1gnet/pen/raJgoB

Поисковикам типа не нравится

именно. тег table можно использовать только для таблиц в чистом виде. если хотите воспроизвести поведение таблицы то отлично подходит

display:table>display:cell

overflow: hidden

ну что значит гораздо хуже? каждому методу свое место. нужно смотреть по ситуации, а не говорить что одни методы дерьмовые, а другие офигенные.

по поводу clear:both,  ну как минимум лишний див надо вставлять, что есть большим минусом. и я что-то не замечал в современных фреймверках (тот же бутстрап) данного метода. да и вообще его встречаю в основном в старых верстках. может это конечно жизнь меня так оградила от этого метода, но я не вижу повода его использовать. могу конечно ошибаться, если так то поправьте

не понял чем вам флоат не угодил? тем что валится pagination валится? так это легко фиксится http://cssdeck.com/labs/qkkiuqf4

.pagination:after{  clear: both;  content:'';  display: table;}

либо на .pagination дать overflow:hidden;

вот тут собрал различные методы решения http://codepen.io/Z1gnet/pen/jEwRao

p.s.

дополнительного блока clear с свойством {clear: both}

это устаревший и плохой метод

попробуй такое <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">