html - Making font size responsive with parent div width and height css -


i´m usign font-size: vw;

#foti_module_wrapper .tools-nav-option {     color: #666666;     font-size: 6.2vw; } #foti_module_wrapper .tool-nav-label {     font-size: 3.2vw;     line-height: 4px; } #foti_module_wrapper .tool-item {     -webkit-box-flex: 1;     -webkit-flex: 1 0 auto;     -ms-flex: 1 0 auto;     flex: 1 0 auto;     display: flex;     text-align: center; } #foti_module_wrapper .tools-nav-option {     -webkit-box-flex: 1;     -webkit-flex: 1 0 auto;     -ms-flex: 1 0 auto;     flex: 1 0 auto;     padding: 10px;     color: #292929;     font-size: 20px;     text-align: center;     line-height: inherit;     cursor: pointer;     border: 0;     -webkit-appearance: none;     -moz-appearance: none;     appearance: none;     z-index: 2;     background: white; } 

in mobile works fine, in tablet font icon , text overflow tool-item padding...

i want avoid this

enter image description here enter image description here

i want result: enter image description here

definitely use media queries wanted result.

you can use resource snippets save time:

https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

good luck!


Comments

Popular posts from this blog

Command prompt result in label. Python 2.7 -

javascript - How do I use URL parameters to change link href on page? -

amazon web services - AWS Route53 Trying To Get Site To Resolve To www -