Velidan
Newbie-
Posts
28 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Velidan
-
Подскажите пожалуйста.
-
Доброго дня уважаемые коллеги, подскажите пожалуйста, как можно сделать такую вот скругленную белую тень вверху блока вот здесь ( http://prntscr.com/8tow41 ) Пробую сделать вот так: https://jsfiddle.net/z53k01w9/1/ Вот только не получается как на рисунке - округлить её хорошо внизу. Помогите пожалуйста. Заранее спасибо.
-
отменить смещение текста при list style position inside
Velidan replied to Velidan's question in HTML Coding
Интересный трюк, возьму на заметку. Спасибо большое. П.С. интересовал именно такой вариант, так как хотелось знать, что можно сделать конкретно в таком случае. -
Доброго дня уважаемые коллеги, подскажите пожалуйста, можно ли как-то отменить смещение текста при переносе строки под маркер списка при позиции inside? (Можно только при позиции inside). буду благодарен за любую помощь. https://jsfiddle.net/shaoau5z/
-
Доброго дня уважаемые коллеги. Подскажите пожалуйста, корректно ли я пользуюсь свойством flex-grow для того, чтоб элемент занял все доступное пространство? Пример: https://jsfiddle.net/uvbc8wtc/ П.С. Только, пожалуйста, не надо цитировать справочник. Прекрасно знаю, что это свойство "Определяет жадность отдельного элемента относительно других" и т.д. Интересует или может можно как-то по другому автоматически заполнить все доступное пространство и вообще правильно ли я делаю все таким образом. Заранее спасибо за любую помощь.
-
П.С. забыл упомянуть, что хочется без использования псевдо-элементов и отдельных градиентов для них. wwt Это очень здорово, спасибо огромное за помощь. А можно как-то обойтись градиентами только для одного элемента? Пробовал наложить 4 градиента, один основной, белый над ним и 2 по сторонам с углом 45% (чтобы перекрывали белый верхний градиент и делал скругленные уголки). Но как-то очень топорно получается. Во общем, чтобы не утруждать никого, спасибо за ответ. Ответ дан, он замечателен, работает и все отлично. А с градиентами я уже сам поиграюсь. Но я уверен, что можно обойтись без псевдо.
-
Доброго дня уважаемые коллеги. Подскажите пожалуйста, можно ли сделать с помощью градиентов вот такой эффект тиснения? http://savepic.net/7196577.htm Обычный градиент я знаю как делать, использовать несколько градиентов также умею. Но здесь как-то оно на искоса идет у уголков, даже не знаю что делать. Вырезать картинку и так пихать также не очень хочется. Буду благодарен за любую помощь.
-
Понял, спасибо огромное. (Про консоль разработчика, что-то не подумал, извините).
-
Доброго дня уважаемые коллеги. Помогите, пожалуйста, разобраться в таком вопросе: Если у нас есть img и в нем src к картинке. Браузер шлет запрос к картинке, а если у меня эта картинка выводится через background: url('/img.png') в стилях. Будет ли к ней также запрос или все откомпилится при единственном запросе браузера к стилям? Т.е. дает ли преимущество в запросах к серверу отображения картинок в стилях через фон, а не через img? Заранее спасибо.
-
При наличии border-right/left вычесть высоту скроллбара
Velidan replied to Velidan's question in HTML Coding
Очень грамотно объяснили. Не знал нюансов с тенью. Очень благодарен. -
При наличии border-right/left вычесть высоту скроллбара
Velidan replied to Velidan's question in HTML Coding
Прошу прощения, изначально посмотрел на Там увидел, что тень смещена стабильно на 100px вверх. А вообще это именно то что нужно. Только очень странно что тень скрывается под скроллбаром, а граница нет. Не знал, спасибо огромное. -
При наличии border-right/left вычесть высоту скроллбара
Velidan replied to Velidan's question in HTML Coding
Спасибо за ответ. Да, это нормальный вариант, если точно знать ширину скроллбара) а он в разных ОС по разному. Единственный вариант, в таком случае, это скрывать системный скроллбар и делать свой. Тогда точно будем знать вычитаемую высоту. Только жаль, что на чистом css такие проблемы возникают с элементарными вопросами. -
При наличии border-right/left вычесть высоту скроллбара
Velidan replied to Velidan's question in HTML Coding
Спасибо за помощь, но здесь минусы из-за которых вариант также не подходит: есть hr (которая играет роль границы). Она вообще внизу стоит, вне пределов контейнера + явно указана высота. (Высота таблицы динамически меняется, по этому такой вариант не подходит). Подобное решение худо-бедно подходит к вертикальному скролу (да и то, если точно знать нужные размеры), а вот для горизонтального - к сожалению, нет. -
При наличии border-right/left вычесть высоту скроллбара
Velidan replied to Velidan's question in HTML Coding
Спасибо за ответ. Но, при прокрутке граница также прокручивается. (Это также как создать обертку для внутреннего контента и назначить ей рамку. Она - то будет по высоте как надо, но будет прокручиваться при прокрутке). Можно ли так сделать, чтобы она была прижата справа и не двигалась (К сожалению fixed не работает с relative, а было бы намного удобнее работать). Update https://jsfiddle.net/e1o5kgk8/2/ (вернул к изначальному состоянию) -
Доброго дня уважаемые коллеги. Подскажите, пожалуйста, как можно сделать так, чтобы у блока, который имеет горизонтальную прокрутку, боковая граница не тянулась на высоту скролбара. П.С. вариант с тем, чтобы внутри поставить обертку, назначить ей границу (таки образом, наша граница не будет выходить за грани видимого блока к концу скроллбара) не очень хорош, потому что при прокрутке граница будет двигаться также с прокручиваемым контентом. В общем вкратце. Как можно сделать так, чтобы border-right: 1px solid black; блока с горизонт прокруткой не вылезала на скроллбар, а ограничивалась высотой самого блока? https://jsfiddle.net/e1o5kgk8/ Буду благодарен за любую помощь.
-
Да, именно это я и хотел сделать. Очень жаль, хотелось средствами css это провернуть. Ведь если все по y - тогда по полной ширине текст прекрасно заполняется и тянется в высоту сколько ему нужно. Очень жаль, что по оси x так не получается. Как-то странно выходит. Почему бы не сделать и для горизонтали такую возможность. Алёна Стрелкова Спасибо за помощь, но это не совсем то что мне нужно, указанные вами свойства влияют на позиционирование дочерних элементов/контента внутри flex-контейнера. Но не влияют на заполненность текста при горизонтальном скроле без явно заданной ширины.
- 7 replies
-
- white-space
- прокрутка горизонтальная
-
(and 1 more)
Tagged with:
-
Хорошо, я это понимаю. Спасибо. Только я спрашивал, а как можно сделать так, чтобы контент заполнял всю допустимую высоту и при этом тянулся в ширину без её явного указания в явных величинах?
- 7 replies
-
- white-space
- прокрутка горизонтальная
-
(and 1 more)
Tagged with:
-
Доброго дня уважаемое сообщество. Столкнулся с неприятным нюансом и очень нужна помощь. https://jsfiddle.net/96o200ds/2/ Для горизонтальной прокрутки у меня блок .overview имеет white-space: nowrap; (Потому что если не поставить так, тогда горизонтальная прокрутка не появится, а контент будет идти себе по высоте вниз). Выставить четкую ширину (например: 2000px ) я не могу, так как ширина контента динамическая. Проблема в том, что контент не хочет выстраиваться на всю высоту и идти себе по ширине дальше, за границы видимого блока, а выстраивается в одну строчку. Можно ли сделать так, чтобы контент заполнял всю высоту и дальше выстраивался себе в ширину? П.С. Можно, конечно, на js при загрузке страницы вычислить ширину контента и назначить такую, но хотелось бы на css все сделать. Буду благодарен за любую помощь.
- 7 replies
-
- white-space
- прокрутка горизонтальная
-
(and 1 more)
Tagged with:
-
Вопрос решил с помощью js. Жаль, что на обычном CSS невозможно такое. Еще есть куда расти
-
Дорбого дня уважаемые коллеги. Столкнулся с очень интересным вопросом. Есть врапер - с pos: relative, внутри него список (pos: absolute) и в LI находится еще один выпадающий список (pos: absolute). Он находится ровно справа левого блока. За врапером. Внутри него также есть LI с контентом. У него задана min-width и height. Демонстрация: https://jsfiddle.net/ox7cvj32/1/ Хочу, чтобы при достижении такого количества контента, которое превышает высоту данного списка, его ширина увеличивалась и контент просто шел другой колонкой. Есть вариант сделать: column-count и его производными, но нужно сразу указать количество столбцов. Мне же нужно, чтобы было динамически. Нет контента - ширина такая-то и одна колонка, контента много и он больше высоты блока - ширина увеличилась и контент разместился в другой колонке. Буду очень благодарен за любую помощь. Заранее спасибо.
-
Здорово. Снимаю шляпу. Спасибо вам большое. Также думал о том, что придется совместить несколько градиентов, только не знал как именно. П.С. А почему вы использовали background-image, а не background ?
-
Доброго дня уважаемые коллеги. Столкнулся с одним очень неприятным нюансом, а именно , не могу придумать, как можно сделать радиальный градиент "уходящим в прозрачность". Чтобы не быть голословным вот демонстрация, как хочется сделать: http://savepic.net/6942734m.png А вот, что у меня на данный момент, получилось http://savepic.net/6943758m.png Код простенький: Код CSS 1 background: #0A85CC radial-gradient(51% 255% at 100% 0%, #2f97d4 97%, transparent) no-repeat; Единственный нюанс, это то, что не могу никак сделать его плавно уходящим в прозрачность. Пробовал сделать линейным (там все здорово, но беда в том, что не получается линейный градиент округлить Помогите, пожалуйста, буду очень признателен. Заранее спасибо.
-
Спасибо за ответы. amalia - Не совсем то, что нужно так как мне нужны только прозрачные края, а таким методом только со всем рисунком придется работать ( . Было бы здорово, если бы можно было указывать координаты прозрачности=)
-
Подойдет абсолютно любой вариант лишь бы работало. На старые браузеры вниманию не обращаю. У вас есть какие-то идеи? П.С. вариант с наложением градиента данному тегу с изображением уже пробовал, не работает.
-
Доброго дня уважаемое сообщество. Подскажите пожалуйста, как можно сделать так, чтобы у картинки в теге img (именно в img) была боковая прозрачность с обеих сторон? (вариант с блоком поверху и его прозрачностью не подходит ибо нужно, чтобы фон просвечивался). Можно ли вообще такое сделать? Заранее спасибо за любую помощь. ссылка на изображение, размер: 466 кбайт, 1011 x 360 точек