Форум программистов, компьютерный форум, киберфорум
Наши страницы

HTML, CSS

Войти
Регистрация
Восстановить пароль
 
Рейтинг: Рейтинг темы: голосов - 83, средняя оценка - 4.71
Schtrich
weboman
210 / 195 / 11
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
#1

Резиновый font-size, Как сделать резионвый font-size в блоке? - HTML, CSS

26.09.2011, 09:17. Просмотров 11877. Ответов 2

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<HTML>
<HEAD>test</HEAD>
<BODY>
<style>
.test {
width: 20%;
height: 9%;
position: absolute;
left: 0;
top: 50px;
font-size: 100%;
border: 1px solid black;
}
</style>
<div class='test'>100$</div>
</BODY>
</HTML>
у блока .test выставлены %, потому что он тоже должен быть резиновым, как и размер текста внутри него, а так попробуйте расширить-сузить браузер, текст либо исчезает, либо остается тем же размером если допустим px выставишь, а должен иметь процентное соотношение, т.е. увеличиваться-уменьшаться вместе с размера окна? как видите font-size: 100%; меня не спасло, что делать?

live-code: http://jsfiddle.net/Stasonix/bm4Nb/1/
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
26.09.2011, 09:17
Я подобрал для вас темы с готовыми решениями и ответами на вопрос Резиновый font-size, Как сделать резионвый font-size в блоке? (HTML, CSS):

font-size 0 - HTML, CSS
Здравствуйте. Столкнулся с такой проблемой. Есть сайт http://test.bricrb.by/ При просмотре в стандартном браузере андроида старых...

Неуправляемый font-size - HTML, CSS
В файле media заданы размеры шрифтов в зависимости от ширины экрана: @media only screen and (max-width: 1100px) { p, a {font-size:...

Применение стиля font-size:0 - HTML, CSS
А вот интересно, зачем здесь .container { font-size: 0; /*fix white space*/ } Один вопрос - одна отдельная тема! ...

Использование font-size с величиной vmin - HTML, CSS
Доброго времени суток, есть проблема с использованием font-size: vmin видно как текст уменьшается и увеличивается, именно постепенно,...

Странности с font-size на разных разрешениях мониторов - HTML, CSS
Всем привет. Делаю сайт. Вот его адрес: musaget.net Тестировал его на всем, что попадалось под руку: Айфон, Айпад, Планшет и смартфон на...

Что не так с font-size для мобильных устройств? - HTML, CSS
По-идее должен быть размер шрифта в 16px, но его тогда вообще не видно, приходится использовать 44. Где я мазанул?

2
assassin947
9 / 9 / 0
Регистрация: 06.08.2010
Сообщений: 56
26.09.2011, 12:55 #2
Здравствуйте. Если font-size задавать в процентах, то за 100% берется размер шрифта родительского элемента, а вовсе не его ширина. Попробуйте сделать это через jquery
http://dimox.name/dynamic-font-size-on-jquery/
0
Qwertiy
821 / 629 / 75
Регистрация: 20.08.2013
Сообщений: 2,524
23.08.2013, 12:30 #3
Поменялось что-нибудь за 2 года, или по-прежнему только джаваскрипт? Интересует задание шрифта относительно высоты или ширины контейнера (или его родителя).
0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
23.08.2013, 12:30
Привет! Вот еще темы с ответами:

кросс css для FF и Chrome стиль font-size - HTML, CSS
для FF font:small-caps bold 11px/20px Tahoma; и для Chrome font:small-caps bold 13px/20px Tahoma; будут выглядеть одинаково....

style="font-size" в IE - HTML, CSS
Подскажите как можно заменить конструкцию &lt;input type=password name=rpass size=15 style=&quot;font-size: 10px&quot;&gt; чтоб она корректно работала в...

<font color="red"> Текст </font> - HTML, CSS
Здравствуйте, не могу покрасить текст в красный цвет, в чем проблема? Код: &lt;?php session_start(); ?&gt; &lt;!DOCTYPE HTML PUBLIC...

Font awesome или как сделать иконки соц сетей без дива - HTML, CSS
Возник такой вопрос долго мучился позиционированием шрифта внутри дивов и тут я решил попробовать подойти иначе вписал иконки задал фоновый...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru