The Tournament Director Forums
Welcome, Guest. Please login or register.
Did you miss your activation email?
June 19, 2013, 08:21:44 AM

Login with username, password and session length
Search:     Advanced search
17217 Posts in 3152 Topics by 1522 Members
Latest Member: virtual930
Back to The Tournament Director main site
* Home Help Search Login Register
+  The Tournament Director Forums
|-+  Main
| |-+  Templates, Layouts and Sounds
| | |-+  Layouts, Fonts & IE9
« previous next »
Pages: [1] Print
Author Topic: Layouts, Fonts & IE9  (Read 425 times)
T-Bone
Full Member
***
Posts: 122


View Profile
« on: November 25, 2011, 10:04:54 AM »

Working on a new layout and attempting to solve the pesky "screen keeps changing sizes as the clock ticks down" problem. Searched an old hard drive and discovered I had Monotype's Arial Monospaced Bold postscipt font. Aha, that should do it! Installed and screens remained constant...it's just the font appeared to be something like Times New Roman. Well, maybe IE9 has a problem with postscript fonts? Let's drop 25-bucks on the TrueType version. Now the font looks correct but the screen is "jumping" as the clock counts down. Finally used Arial Unicode MS and display--while not exactly matching proportional Arial--looked OK and cell size remained the same throughout a full 20 minute round. What this world needs is a good visual layout editor and more free fonts!

Hope everyone is enjoying the Thanksgiving holiday. I was until I spent $25 which could have gone toward Black Friday.
Logged

If it ain't naked, deep-fried or poker-related, I ain't interested!
jodybingo
Hero Member
*****
Posts: 592


View Profile WWW
« Reply #1 on: November 25, 2011, 03:40:06 PM »

I solved this by giving the cell a static size (width and height) in pixels..nothing shifted after that
Logged

Corey Cooper
Administrator
Hero Member
*****
Posts: 4312


View Profile
« Reply #2 on: November 25, 2011, 09:25:04 PM »

Going a step further, you can "encase" your clock in an HTML <div> element, and by giving it the right style attributes you can prevent it from shifting anything around.  You'll need to determine the height and width of your clock, but you can experiment to obtain that.  Change the HTML of your clock cell to:

<div style="height: 200px; width: 500px; overflow: hidden"><clock></div>

Setting the overflow attribute to hidden tells the div that even if the contents (the clock in this case) is bigger than 500x200 pixels, to crop it (just chop it off).  Basically, this means the div will be 500x200 pixels no matter what.  You can adjust this until it fits your clock exactly.
Logged
T-Bone
Full Member
***
Posts: 122


View Profile
« Reply #3 on: November 26, 2011, 02:36:17 AM »

Thanks, guys. I had already set the clock to a static size via height & width but had completely forgotton about the <div> trick which I've used in the past on other layouts. I'll give it a try. In my own defense, most of my experience in I.T. was in management--not actually doing anything!  Roll Eyes
Logged

If it ain't naked, deep-fried or poker-related, I ain't interested!
Pages: [1] Print 
« previous next »
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.16 | SMF © 2011, Simple Machines Valid XHTML 1.0! Valid CSS!