Reponse text size

Hey,

I'm using this free wordpress site and whenever a title is to longer it do's an enter and ruins the entire look of the website by pushing everything down looking out of place.

Any idea how I can set the text size to shrink in a Class thats for example max 300 pixels width so it will always fit and not push the other stuff down.

Has to be done in CSS only, don't think I can add js, because it's the free version.

 

You really should just buy webhotel or vps for your site... No limitations to Wordpress that way.

If you want to set maximum width to element:

Code:

.classname {
   max-width: 300px;
}

If you want to truncate the text so that it doesn't wrap to next line:

Code:

.classname {
   max-width: 100%;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

If you want to adjust the font size based on browser window width, use media query:

Code:

 /* This gets applied to screen/window size that are smaller than 400px */
@media screen and (max-width: 400px) {
    .classname {
        font-size: 13px;
        /* and what ever else you want */
    }
}