Guru3D.com Forums

Go Back   Guru3D.com Forums > General > Programming/Html
Programming/Html C++,Visual Basic,HTML,Flash,OpenGL,Modelling,Java.



Reply
 
Thread Tools Display Modes
Reponse text size
Old
  (#1)
Jamie T
Master Guru
 
Videocard: MSI GTX 980Ti OC Edition
Processor: 4770k
Mainboard:
Memory: Corsair Vengance 16GB
Soundcard:
PSU: Corsair 650RM
Default Reponse text size - 10-22-2015, 20:49 | posts: 318

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.
   
Reply With Quote
 
Old
  (#2)
Anarion
Ancient Guru
 
Anarion's Avatar
 
Videocard: EVGA GeForce GTX 1070 ACX
Processor: Intel Core i7 3770K
Mainboard: ASUS P8Z77-V
Memory: G.SKILL RipjawsX 16 GB
Soundcard: Sound Blaster Zx + HD 595
PSU: Corsair AX760
Default 11-01-2015, 09:29 | posts: 12,906 | Location: Finland

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 */
    }
}

Last edited by Anarion; 11-01-2015 at 09:33.
   
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump



Powered by vBulletin®
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
vBulletin Skin developed by: vBStyles.com
Copyright (c) 2017, All Rights Reserved. The Guru of 3D, the Hardware Guru, and 3D Guru are trademarks owned by Hilbert Hagedoorn.