Cooking For Engineers Forum Index Cooking For Engineers
Analytical cooking discussed.
 
 FAQFAQ   SearchSearch   MemberlistMemberlist   UsergroupsUsergroups   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 

Off Topic: Recipe Summaries - Standards and Microsoft
Goto page 1, 2, 3, 4  Next
 
Post new topic   Reply to topic    Cooking For Engineers Forum Index -> Comments Forum
View previous topic :: View next topic  
Author Message
Cooking For Engineers



Joined: 10 May 2005
Posts: 16776766

PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Off Topic: Recipe Summaries - Standards and Microsoft Reply with quote


Article Digest:
Until last weekend, the majority of my readers used some version of Internet Explorer to view my website. Something changed, and now I have a readership of which 75% are using a Mozilla based client. This is a problem for me because I have known about an issue with my website that I've been trying to fix for the last month and failed.

My recipe summaries don't display properly in browsers other than Internet Explorer. This is mainly because Internet Explorer is not fully CSS standard compliant and I had to come up with creative ways to get IE to present the table the way I desired it to. Unfortunately, some of the other browsers are standards compliant and render the tables awkwardly.

I've been working on this problem for the last couple days and when I come up with a solution, I will convert all my recipe representations over to the format that will at least work with IE and Firefox (that's my current goal).

Anyone know how to do vertical text in CSS with firefox? I rely on vertical text to save horizontal space in my recipes and use:
layout-flow: vertical-ideographic;
but this does not seem to work in Firefox.

The other issue I have is intersecting table elements (I need table elements to form non-rectangular shapes [like L's]). If someone can give me some tips, I'd be much appreciated.

Thanks,
Michael
by Michael Chu
Back to top
View user's profile Send private message
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

I don't think that its posible to rotate text in firefox (or Gecko based browsers in general). There's some solutions in CSS3 but I don't think its implemented anyware yet. Perhaps you can use something like photomatts script but that requires php (more discussion here).

jens persson

PS I really like the recipe summaries

PPS The new readership might come from Widgetopia
Back to top
Michael Chu



Joined: 10 May 2005
Posts: 1619
Location: Austin, TX (USA)

PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

Thanks for the comments Jens,

I've given up trying to do the rotated text in anything except for Explorer (at least for now). (Also, I'll have to move servers or pay money each month to add php support.)

I think I've got the website working with Explorer and Mozilla (FireFox) although Firefox seems to render the tables inconsistantly. Safari still doesn't render the tables properly though. I'm going to go back to writing articles and put fixing the formatting on the back burner for now until I come up with a better idea. (Someone suggested GIFs but I really want to keep the tables so readers can cut and paste them into a word processor to print.)

Michael
Back to top
View user's profile Send private message Send e-mail
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

"Someone suggested GIFs but I really want to keep the tables so readers can cut and paste them into a word processor to print."

If printing is a concern, why not make a print stylesheet? Hide everything except the main content. Works transparently on all browsers.
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

I'd give up on the vertical text, there's no support for it in non-IE browsers. However, keep it for those users and don't worry about it as it doesn't ruin the layout to read it normally.

As for the L-shaped sections. You need cellspacing="0" added to your table so that the outer box of one cell overlap with the outer boxes of it's 4 neighbors.

Then you can turn off the two touching borders to create the L-shape with CSS like "border-right: none;"

Very nice site. Keep up the good work.
Back to top
Michael Chu



Joined: 10 May 2005
Posts: 1619
Location: Austin, TX (USA)

PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

I have given up on vertical text - left it in for IE users so they have a more compact representation of the recipe, but the horiz. text doesn't hurt in other browsers.

I cannot use border-right: none because this doesn't work properly in IE (hey microsoft! Read the CSS spec! None has PRECEDENCE!). I kludged together a semi-working solution by making the border-right color the same as the background, but this doesn't work on Safari.

--

A print stylesheet won't alter the fact that the recipe summary is a gif (with a green background). In tabular format, at least you can copy and paste it into a word processor or spreadsheet to modify for printing (only need to change the "hidden" borders).
Back to top
View user's profile Send private message Send e-mail
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

Just as an aside, and I haven't read all the other posts, I use Opera 7.54 and all the rescipes (as well as everything else on the site) looks good to me.

Just thought I would let you know.

-Sucktastico@techloser.com
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

Try IE7 at http://sf.net/projects/ie7
Seb
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

Ok, well if you are looking for a way to generate text vertically, I suggest doing it client side. Using PHP, you can generate images. If your content is dynamically generated from a database, use PHP to dynamically generate images and populate the tables that way.

Other than that have you looked into seeing if javascript can handle it? I think there is also a solution for javascript to do this.
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

GIF or PNG images can have a transparent background.
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

I agree with the previous post on "IE7". It's an amazing set of scripts/CSS so almost all CSS with render the same in Internet Explorer as it does in Firefox. (I plan on using it on all sites I maintain.) Good luck...
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

You should probably blow off IE.

I looked at your site in IE 5 (5.00.3700.1000)
which is still pretty common.

Your tables come out with black text on a dark green background and no border lines at all, just these floating black works--the result is nearly invisible and totally incomprehensible.
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

I'm using Firefox 0.8 and all the recipes look yummy.

I don't know about the CSS thingie. What aisle would I find it in?
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

To fix the border-right: none in IE you can use border-right: 0; It'll still display fine in at least firefox (I'm not sure about others)
Back to top
Guest






PostPosted: Tue Aug 17, 2004 2:39 pm    Post subject: Reply with quote

If you can identify the webbrowser by the id string then you can choose how to serve up pages for particular browsers. It seems that the problem is IE and then everything else. make IE the exception and cater for complient browser if as you say 75% of the traffic is using firefox. It doesn't have to be too complicated just point the IE browser at a download link for firefox Wink
Seriously the Internet is about open standards supported across many platforms. Microsoft is about locking users into their closed standards and operating systems. It's the little annoying things that microsoft do to ensure that people use microsoft products
Back to top
Display posts from previous:   
Post new topic   Reply to topic    Cooking For Engineers Forum Index -> Comments Forum All times are GMT
Goto page 1, 2, 3, 4  Next
Page 1 of 4

 
Jump to:  
You cannot post new topics in this forum
You can reply to topics in this forum
You cannot edit your posts in this forum
You can delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group