Vertical Text - A little " How to" present for bobby (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets



Message


gorilla -> Vertical Text - A little " How to" present for bobby (6/14/2003 21:28:15)

<html>
<head>
<style>
<!--
#verticaltext {
writing-mode: tb-rl;
filter: flipv fliph;
}
-->
</style>

</head>
<body>


<div id=" verticaltext" >WHEE!!!!! Hello Bobbeeeeee!!!!!!! Karsten
Sub junior deputy under assistant to the deputy assistant under junior deputy spokesgorilla :-)

København
Juni 15 2003


</div>

</body>




gskywalkers -> RE: Vertical Text - A little " How to" present for bobby (6/14/2003 22:27:13)

Gorilla.........how do you make the font bigger when using this style?




gorilla -> RE: Vertical Text - A little " How to" present for bobby (6/14/2003 22:54:49)

quote:

ORIGINAL: gskywalkers

Gorilla.........how do you make the font bigger when using this style?



like this:

<html>
<head>
<style>
<!--
#verticaltext {
writing-mode: tb-rl;
filter: flipv fliph;

/* gskywalkers the line below specifies the font size mess with it and save the file to see the results :-) K */

font-size:2.5em;

}
-->
</style>

</head>
<body>


<div id=" verticaltext" >WHEE!!!!! Hello gskywalker2!!!!!!! You just add the code for the font size as per normal for css selectors Karsten
Sub junior deputy under assistant to the deputy assistant under junior deputy spokesgorilla :-)

København
Juni 15 2003


</div>

</body>




gskywalkers -> RE: Vertical Text - A little " How to" present for bobby (6/14/2003 22:58:57)

Thanks Gorilla.....

gskywalkers




Spooky -> RE: Vertical Text - A little " How to" present for bobby (6/15/2003 0:11:44)

W
h
o

n
e
e
d
s

C
S
S
?

[:D]




bobby -> RE: Vertical Text - A little " How to" present for bobby (6/15/2003 1:04:42)

That is the coolest trick I' ve learned in a long time.

I' m gonna have to play with that one in a few browsers.

I have a client/friend who is about to have one heck-uv-a fun prank pulled on them in the very near future. [:D]

Thanks be to the Mighty Primate for blessing me with this powerful magick.
[sm=lol.gif]




gorilla -> RE: Vertical Text - A little " How to" present for bobby (6/15/2003 10:23:56)

quote:

ORIGINAL: Spooky

W
h
o

n
e
e
d
s

C
S
S
?

[:D]



Lazy people like me![sm=lol.gif]

Med venlig hilsen

Karsten
Sub junior deputy under to the deputy assistant under junior deputy spokesgorilla :-)


København
Juni 15 2003




enrightd -> RE: Vertical Text - A little " How to" present for bobby (6/16/2003 15:45:06)

Clever.

But Why would anyone want " verticaltext" anyway???[:D]




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 7:30:14)

I know this is an old thread, but honestly, I registered with this forum just to reply to it!

quote:

Enrightd says:

But Why would anyone want " verticaltext" anyway???


Check this out: http://echs.lunaclick.net/content/frames.htm

The text in the frame on the left side was done with the CSS trick Gorilla posted, which was *exactly* what I was looking for. It wouldn' t have looked nearly as smooth if I' d used the graphic I made or just put a <br> between every letter.

Thanks, Gorilla! [:)]




Gil -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 7:48:22)

quote:

Check this out: http://echs.lunaclick.net/content/frames.htm


All I get is a series of popups telling me at the wong site....




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 8:18:35)

quote:

Gil says:

All I get is a series of popups telling me at the wong site....


My main site page (http://www.lunaclick.net) does have a looping routine of confirm and alert dialogs to ensure that people are no longer using my old domain...it alerts you and takes you to the new domain if you click " Cancel," but releases you from the loop if you click " OK." The ECHS subdomain works fine, though, and does not include any popups. If you click on the link in my last post, it should take you directly to the correct frameset.

(If you go to http://echs.lunaclick.net, you' ll get a page that takes you nowhere except back to the main LunaClick site. If you go to http://echs.lunaclick.net/content, you get a directory listing (gotta fix that, lol) from which you can click " frames.htm" to get to the intended page.)

Please try again...it should work fine. [:)]




Gil -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 8:36:56)

quote:

The ECHS subdomain works fine



Nope - I get a page with a link,

# ECHS Alumni are just a bunch of LunaClicks #

that takes me to an endless looping of popups...




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 9:04:51)

quote:

Gil says:

Nope - I get a page with a link,

# ECHS Alumni are just a bunch of LunaClicks #

that takes me to an endless looping of popups...


Well, like I said, if you go to the main subdomain page, http://echs.lunaclick.net, that' s what you' ll get. [:)]

You have to go specifically to http://echs.lunaclick.net/content/frames.htm.




Gil -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 9:18:45)

quote:

You have to go specifically to http://echs.lunaclick.net/content/frames.htm.



I DID - and got:

" Nope - I get a page with a link,

# ECHS Alumni are just a bunch of LunaClicks #

that takes me to an endless looping of popups..."




fiachra -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 17:29:24)

Umm I got 404d and taken here:

http://echs.lunaclick.net/messages/404notfound.htm

LCAngela - I' m " minding the shop" while the gorillas are away. I' ll pass on your thanks.

F




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (7/28/2003 17:42:14)

quote:

Fiachra says:

Umm I got 404d and taken here


Make sure the " ." isn' t tagging itself onto the end of the URL...I had this problem earlier, actually, when I clicked the link on the board.

Try this link: http://echs.lunaclick.net (I' ve just uploaded some updates.)




pageoneresults -> RE: Vertical Text - A little " How to" present for bobby (7/30/2003 12:55:41)

CSS3 Text Module - W3C Candidate Recommendation 14 May 2003 - writing-mode

Pretty cool stuff! How the heck did you get your hands on that? ;)

Be careful when using CSS2 and CSS3 formatting. There are still many browsers that are now playing catch up on CSS2. Some have not yet addressed CSS3, Opera is one of them. I viewed the above site in Opera and it does not understand the writing-mode property. So, that great looking effect in IE is negated when viewing in other browsers who may not support the property. Just something to think about if you have more than a small percentage of visitors using something other than IE.




Paul Orlowski -> RE: Vertical Text - A little " How to" present for bobby (7/30/2003 13:12:43)

Doesn' t work for me.
I pasted the html into notepad then into the Front Page 2002 Html tab replacing what was previously there. My text comes out like a paragraph, not vertical.

Is there something else I need to do?

Paul




BeamMeUp -> RE: Vertical Text - A little " How to" present for bobby (8/19/2003 14:43:55)

I copied and pasted this code into an html page and nothing happened. Just got plain old horizontal text - what am I missing? I am running IE 5; do I need a newer version of the browser?




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (8/19/2003 14:59:39)

Paul and BeamMeUp:

Take the space out in front of the DIV ID attribute...
id=" verticaltext" should be id="verticaltext"

It should work fine then. :)




gorilla -> RE: Vertical Text - A little " How to" present for bobby (8/19/2003 15:21:32)

Just to make one quick point. Karsten did this as a joke in response to a posting Bobby made elsewhere. See his sig :-) and indeed the title of the thread.

He sent bobby a screenshot of what the code does and wondered how many millionths of a second it would be before bobby logged in, found, and tried, the code.

He had a serious intent also, to, as PageOneResults spotted, give a sneak preview of just one of the things we can expect from CSS3. PageOneResults' other point is very important also.

This is non-standard code and may well not render properly in many current browsers. What this means is that when a browser doesn't understand the instructions in Karsten's code, it [i}won't break the browser all that will happen is that the browser will ignore the instructions and render the paragraph as a normal one.

One point of optimism for CSS3 btw is that the word we're getting here is that W3C are plannning on releasing it "into the wild" in a modular way. Thereby giving browser manufacturers a way of planning their upgrades/support.

Hope this helps and thank you LCAngela for spotting the typo.


Thor

Spokesgorilla :-)

Copenhagen
Denmark
August 19th 2003

PS:

Paul

From the notes IE6 was the version of IE tested that this did work for. So many bugs in IE5 that for once I suggest an upgrade.

T




Paul Orlowski -> RE: Vertical Text - A little " How to" present for bobby (8/19/2003 15:49:34)

I removed the space in
id="verticaltext"

This is the html code copied back from my page.
It's still coming up horizontal for me.

<html>
<head>
<style>
<!--
#verticaltext {
writing-mode: tb-rl;
filter: flipv fliph;
}
-->
</style>

</head>
<body>

<div id="verticaltext" >WHEE!!!!! Hello Bobbeeeeee!!!!!!! Karsten
Sub junior deputy under assistant to the deputy assistant under junior deputy spokesgorilla :-)

København
Juni 15 2003
</div>

</body>


Any more suggestions?
Paul




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (2/4/2004 4:27:21)

I can't edit my posts above, or else I'd take care of this myself...

Could one of the mods or admin please remove my links from the posts above, or at least take the end punctuation off of the ones that need it? A couple of the links continually produce error messages in my logs, resulting in unnecessary 404 errors.

I did decide to stop using the vertical text -- even though it's a very cool effect! -- because it indeed didn't translate well (read: at all) in some browsers.

Thanks!




LCAngela -> RE: Vertical Text - A little " How to" present for bobby (2/6/2004 4:29:06)

Please, pretty please, remove my links from above. :) I can edit the post I made the other day, but again, for some reason, I can't edit the older ones. Much obliged!




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.5