Bprompt_, Preferred live.

 
Fenton: Frenchiie: you can’t with CSS alone. You could use an SVG with max-width and text inside that https://css-tricks.com/svg-text-typographic-designs/

Warbington: Hiya. I was wondering if I can change the cl*** of a nav element from within css. Here’s what I’ve got currently: https://jsfiddle.net/zccrku1c/ Is it possible to do it without using the jquery?

Fenton: Jragon: CSS does not change cl***es

Fenton: Frenchiie: I’m ***uming that you want to reduce the font-size to fit, instead of cutting off the overflow, no?

Waycaster: Fenton: Okay. Is there a way to inherit the cl*** to another? IE use a media query and if the screen is big then inherit the navbar-fixed-bottom cl*** into the navbar-bottom?

Gucwa: Fenton: kind of, i think. i want it to stay the same size when the container hits a max-width/height so the text doesnt overflow

Paterno: Fenton: i was thinking of writing a range of media query with max-width that gets triggered when the browser zooms in. Each media query would set a font-size that is actually smaller than the initial font size to the point where when zooming in wouldn’t make much of a difference in the text size

Kinder: But i dont know how accurate that would be.

Roderman: Because zooming in expands how many css pixels equal 1 device pixel right? so if our font size was 16 css pixels and zooming increases the number of css pixels per 1 device pixels, making the font-size in a media query to be smaller than the original size would actually mean shrinking the amount of css pixels per 1 device pixels.

Peaks: Or maybe i can use the zoom property.

Nikodem: Frenchiie: just hmmm saw your url. why would that text. btw, you have an invalid h element there

Vampa: Frenchiie: why would the text get cut off or bigger?

Washing: Bprompt_: why is it invalid

Brouwer: Bprompt_: and it gets cut off when you browser zoom

Opitz: After about 175% zoom, the text isn’t contained fully

Irmeger: Frenchiie: in html, there’s no h element

Bodiroga: Eh? I see only h theere

Gogins: No that was a question

Raimo: Sorry i fixed that part

Greenley: Frenchiie: so. anything with the cutting off? that’s kinda expectable on the user when zooming in so much

Ylonen: I just updated it to h1

Dahmer: Frenchiie: did, same 😛

Beabout: Oh sorry its a new url i think when you update

Cosgrave: Frenchiie: so. anything wrong with the cutting off? that’s kinda expectable on the user when zooming in so much

Havlicek: Https://jsfiddle.net/1Luf3qj8/1/

Passini: Bprompt_: right but i’m trying to make my webapp browser zooming proof

Eytcheson: I could just have everything expand downard and rightward where you have two bars on the website but i’m trying to not have that.

Durfee: Frenchiie: hmmm got url? to your “webapp”

Hylan: I want everything controlled and this text issue is the last thing.

Yardley: Frenchiie: a parrot sitting on my shoulder, tells me you’re fine, is not necessary

Paparella: I just cant . need.fix

Padillia: Frenchiie: there’s nothing to fix, you’re just having an OCD day, is all

Penski: I am OCD’ing hard on this project

Speakman: Maybe because it’s my first webapp project, idk

Sturrock: Frenchiie: noticeable =

Iwamoto: But if its not perfect i cant finish it

Drach: Frenchiie: the text is word wrapping, as it should, wherever it finds a “wrapping” opportunity, usually spaces or dashes, if you want it to keep on wrapping to a character, set word-break: break-all; on the element

Brodmerkel: I had my css and html validated and all looks good. Wamp is working but index is not reading the css file. What is the web site that I can pop the code into to see what is going on?

Pagani: Bprompt_, Preferred live pastebins: http://jsfiddle.net/http://codepen.io/http://paste.asmcbain.net/