AjayAyyar
asked on
Vertical Text Issue
Hello all,
I have a question in regards to the formatting of text VERTICALLY. I found out a way to do this through Cascading Style Sheets, however it resulted in 2 issues:
1. When PRINTED, the text comes out corrupted and cannot be read. I would like to find out a way to rectify this.
2. When viewed in all browsers EXCEPT Internet Explorer, the text is only viewable HORIZONTALLY.
Here is an example of a page which uses the vertical formatting. The vertical text has been shown in the bus timetable. I used CSS to do it:
http://www.webfusion.com.au/busways%5Fwebsite%5Fnew/viewtimetable.asp
If someone could please provide me with a solution to the above 2 issues, I would greatly appreciate it. My main issue is the issue regarding the corrupted PRINTING, since many customers will want to print timetables and ensure that it is easily readable.
Here is the tag i am using currently: <DIV STYLE="writing-mode: tb-rl; filter: flipv() fliph();">
Thanks very much for your assistance.
Kind Regards,
Ajay Ayyar
I have a question in regards to the formatting of text VERTICALLY. I found out a way to do this through Cascading Style Sheets, however it resulted in 2 issues:
1. When PRINTED, the text comes out corrupted and cannot be read. I would like to find out a way to rectify this.
2. When viewed in all browsers EXCEPT Internet Explorer, the text is only viewable HORIZONTALLY.
Here is an example of a page which uses the vertical formatting. The vertical text has been shown in the bus timetable. I used CSS to do it:
http://www.webfusion.com.au/busways%5Fwebsite%5Fnew/viewtimetable.asp
If someone could please provide me with a solution to the above 2 issues, I would greatly appreciate it. My main issue is the issue regarding the corrupted PRINTING, since many customers will want to print timetables and ensure that it is easily readable.
Here is the tag i am using currently: <DIV STYLE="writing-mode: tb-rl; filter: flipv() fliph();">
Thanks very much for your assistance.
Kind Regards,
Ajay Ayyar
If i may say so, I think it looks better with the horizontal text, it is easier to read.
My recomendation would be to change the Y and X axis.
Have the bus names(?) going down and the bus times going to the right.
It will be alittle taller, but if will work when you print it.
My recomendation would be to change the Y and X axis.
Have the bus names(?) going down and the bus times going to the right.
It will be alittle taller, but if will work when you print it.
if u have enough time and u can use php i recommend using the GD library
The only way to get reliable vertical text is to use images.
The properties you used are, as mentioned, IE only. And as you noticed, they don't work well.
The properties you used are, as mentioned, IE only. And as you noticed, they don't work well.
ASKER
hey guys
more to my situation, I changed the existing CSS from <DIV STYLE="writing-mode: tb-rl; filter: flipv() fliph();"> to <DIV STYLE="writing-mode: tb-rl;">, and it allows me to print it correctly! The issue however is that the vertical text is shown TOP TO BOTTOM rather than BOTTOM TO TOP which is how I want it.
Is that ANY way you know that would allow me to make the text go from bottom to top, without using the FILTER? The bus company I am doing this for insists that it needs to be this way... All help would be much appreciated.
The use of images would not be practical in my situation since there are thousands of bus stops...which would make it too long to long, and very resource intensive.
Thanking you in advance.
Kind Regards,
Ajay Ayyar
more to my situation, I changed the existing CSS from <DIV STYLE="writing-mode: tb-rl; filter: flipv() fliph();"> to <DIV STYLE="writing-mode: tb-rl;">, and it allows me to print it correctly! The issue however is that the vertical text is shown TOP TO BOTTOM rather than BOTTOM TO TOP which is how I want it.
Is that ANY way you know that would allow me to make the text go from bottom to top, without using the FILTER? The bus company I am doing this for insists that it needs to be this way... All help would be much appreciated.
The use of images would not be practical in my situation since there are thousands of bus stops...which would make it too long to long, and very resource intensive.
Thanking you in advance.
Kind Regards,
Ajay Ayyar
Filters and graphics are it. There is no other way. If your customer insists on it then tem you have to use graphics and that it wil double the cost of the project to do the graphics. Then they acn either accept what is possible or pay you to do a bunch of graphics.
Cd&
Cd&
ASKER
Thanks COBOLdinosaur.
Before I accept the answer, I have a final query.
I have heard that it is possible to write a CONTROL in VB.NET or Java to allow the vertical text thing to work. If any of you know any URLs where I could find out info on how to do this, it would be much appreciated. Even 3rd party software to purchase would be fine.
Thank you.
Regards,
Ajay Ayyar
Before I accept the answer, I have a final query.
I have heard that it is possible to write a CONTROL in VB.NET or Java to allow the vertical text thing to work. If any of you know any URLs where I could find out info on how to do this, it would be much appreciated. Even 3rd party software to purchase would be fine.
Thank you.
Regards,
Ajay Ayyar
You could have a nice little alphabet. If you get your data from a database, you could parse the route name string into an array. Then, assign something like 8x8px or 10x10px sideways images to the letters, then call the array in reverse, appending the .gif extension and a <br/> to the end of the variable.
At least you only have to create 26 + 26 + 10 + ampersands etc...images.
Well, it would be fun - I've done a few and if you leave 1px white space after the (top), and adjust the image hegiht to suit the letter/case, you can get, well - as good as any fixed space font (if not better!)
Just another way.. if you have a couple of hours to spare.
Lol, let me know if you want my letters.....
At least you only have to create 26 + 26 + 10 + ampersands etc...images.
Well, it would be fun - I've done a few and if you leave 1px white space after the (top), and adjust the image hegiht to suit the letter/case, you can get, well - as good as any fixed space font (if not better!)
Just another way.. if you have a couple of hours to spare.
Lol, let me know if you want my letters.....
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Oh, btw - you can do all that just with PHP.
points to me IMHO
Cd&
Cd&
Yup, roger that. Points to the Master.
On another note, AjayAyyar you never replied - we can do this with images... do you want to have a pop at it? No need to do individual images, we can make an alphabet, parse the var for the $destination name, feed it back out as letters of the alphabet in reverse and print the (sideways) images, linebroken - that'd be fun, in PHP.
Not for the points of course - Cd answered the q. - just for the hell of it. ;)
d.
On another note, AjayAyyar you never replied - we can do this with images... do you want to have a pop at it? No need to do individual images, we can make an alphabet, parse the var for the $destination name, feed it back out as letters of the alphabet in reverse and print the (sideways) images, linebroken - that'd be fun, in PHP.
Not for the points of course - Cd answered the q. - just for the hell of it. ;)
d.
I do not see why he should recieve the points when he just repeats what I stated above:
if u have enough time and u can use php i recommend using the GD library <--- GD Library is for dynamically generating images
Filters and graphics are it. There is no other way. If your customer insists on it then tem you have to use graphics and that it wil double the cost of the project to do the graphics. Then they acn either accept what is possible or pay you to do a bunch of graphics. <--- talks about creating graphics
if u have enough time and u can use php i recommend using the GD library <--- GD Library is for dynamically generating images
Filters and graphics are it. There is no other way. If your customer insists on it then tem you have to use graphics and that it wil double the cost of the project to do the graphics. Then they acn either accept what is possible or pay you to do a bunch of graphics. <--- talks about creating graphics
Hi cachedVB,
I undertand what you're saying. In fact this can be done lots of ways with graphics - and the fact is that Cd& said:
If you want a printable cross-browser version of vertical text, then do it with graphics. <== in the very first reply to the post
I do think that CD& may have been refering to a static image, however the result is there - graphics. And it's first.
Personally, I can do this with my alphabet, too - which if the GD library is not available, will run.
If the original poster wants to take me up on this, or you up on your GD solution - fair enough, that could change the outcome. They have failed to respond, and as it stands; CD& has the solution first. IMHO.
d.
I undertand what you're saying. In fact this can be done lots of ways with graphics - and the fact is that Cd& said:
If you want a printable cross-browser version of vertical text, then do it with graphics. <== in the very first reply to the post
I do think that CD& may have been refering to a static image, however the result is there - graphics. And it's first.
Personally, I can do this with my alphabet, too - which if the GD library is not available, will run.
If the original poster wants to take me up on this, or you up on your GD solution - fair enough, that could change the outcome. They have failed to respond, and as it stands; CD& has the solution first. IMHO.
d.
How about split the points between the two evenly?
Why would there be a split after the user indicated satisfaction with may response, but then failed to grade after I answered their followup?
Cd&
Cd&
Well, technically that'd be 3 ways, if it were split. I just don't think it's deserved.
Graphics are the answer, all our 2 posts do is suggest implementations of graphics.
The poster already said:
"Thanks COBOLdinosaur.
Before I accept the answer, I have a final query."
Cd& replied, the poster didn't. So I'll run with pinaldave's recommendation, as this statement suggested that the original poster intended to credit Cd& solely and in entirety.
;)
d.
Graphics are the answer, all our 2 posts do is suggest implementations of graphics.
The poster already said:
"Thanks COBOLdinosaur.
Before I accept the answer, I have a final query."
Cd& replied, the poster didn't. So I'll run with pinaldave's recommendation, as this statement suggested that the original poster intended to credit Cd& solely and in entirety.
;)
d.
If you want a printable cross-browser version of vertical text, then do it with graphics.
Cd&