[WSG] IE MAC just won't play ball!
HELP! I've just done a site for http://www.charismalab.com. Everything is great for Windows PC, Firefox, Safari BUT the client is looking at the site on her Mac OS 9 IE 5 and it's not right. I've use the import to use a separate style sheet which helped massively but there are some things that I just can't seem to make work! I've downloaded the classic mac IE and can't see what she sees .eg. apparently, the nav line on the bottom of each page breaks off and starts a new line (!) and I've given up on trying to make the wrapper stretch 100% so I'm going to simply give each page a separate wrapper and give it a fixed length, but things still aren't right... can ANYone see where I'm going wrong??? the mac ie css is http://www.charismalab.com/ie51.css Thanks... Adam
[WSG] Extending xhtml strict to include frameset and target
Ok, maybe I'm being lazy, I'm googling for a good tutorial or exemples on the subject, and all I find is theory, so here it goes: I recently got a job as a web designer in a company whose site has previous decades markup. Apart from that I do all the companys graphic work, so time is short. The site has a ancient php seach engine, with a quite large data base, and the rest seams more like php output saved by the browser. Ithas tags for marqees, atributes like blink, links inside a flash movie,lots of heavy animated gifs, a script running at the status bar, an interface completly unrecomended for epileptic users well, I think you can imagine, or visit it at: http://www.ocean-wings.com/ The site is updated every day, since new models como in all the time, and has a quite large and loyal audience, wich by the stats includes users with FF, IE 5 to 6, IE ad Safari on mac (actually not bad at all). The updates are made directly on the markup, update dates are written by hand and the data base is updated separatly, so not only the error risk is significant, but also tasks are unnecessarilly repeated. Such a heavy site is running on frames witch makes all the sense, and some deeper links use the target attribute. I intend to rewrite the site completly to simplify the updating tasks and to make the site faster, more relyable, usable andaccessible. I also intend to do in in standards mode. The company intends to keep thelook and feelof the site, for it has already a very good emotional boundage with the users, so layout changes should be minimum, only to permit some features they intend to offer, like automatic alerts on updated items for subscription users. Since time is a short resource, my idea is to do it in two fases, in my spare time: First rewriting the site as a template indecent code, then turning it into php buiding a new database and using the template as an output container. So now I'm looking for a doctype I can use to include a frameset andtarget attributes in xhtml strict mode (not only to trigger standards mode, but also for me to be able to track any markup error). AndI'm rulling out transitional doctypes as an option. W3C presents a lot of information on extending xhtml, but nothing I can learn or understand in a quick way. There are also several discussions over the matter on very good blogs, but all I needright now is an example doctype, or a tutorial, on how to extend XHTML strict to include frameset and target external modules, and I cannot find one. Can some of you folks help me, please? Thank you, best regards, Isabel Santos
Re: [WSG] Need help on css positioning
G'day As you can see I intend to set the width of the container and the banner into 75% and push them to the left. I intend to reserve the space available in the right after that for the sidebar whose width is set at 25% and positioned to the right. But unfortunately, the sidebar has floated to the right but it is always positioned under the banner. A couple of things you might try: 1. Float the sidebar left instead of right 2. Don't float the sidebar at all. 3. Give the sidebar a little less than 25% width (e.g. 24%), Some browsers cannot add up Regards -- Bert Doorn, Better Web Design http://www.betterwebdesign.com.au/ Fast-loading, user-friendly websites ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Extending xhtml strict to include frameset and target
If you want to use frames you have to use the frames doctype. And only the frames doctype. It should include everything you want to use.Now, in my opinion, you should try to redesign the frames structure in PHP, and do the top frame as a PHP include. Then you can even fix it on the page with CSS if you want. Also, you could redo the marquee with _javascript_, and make it less painful. Anyway, if you are on a tight schedule it's enough to at least attempt making it 1.0 strict, and even if the final product doesn't validate it should be okay. On 9/24/05, Isabel Santos [EMAIL PROTECTED] wrote:Well, simplifying the question: I have these modules from w3c (so there is no need to build them from scratch): PUBLIC -//W3C//ELEMENTS XHTML Frames 1.0//EN SYSTEM http://www.w3.org/TR/xhtml-modularization/DTD/xhtml-frames-1.mod PUBLIC -//W3C//ELEMENTS XHTML Target 1.0//ENSYSTEM http://www.w3.org/TR/xhtml-modularization/DTD/xhtml-target-1.mod and the usual strict dtd: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd I cannot have more than on doctype at the head of my documents so, how do I include the two first modules into my doctype? (without the xml tag before) I'm kind of confused.. Thank you, Isabel Santos
Re: [WSG] Need help on css positioning
Thank Bert Doorn, I have followed your instruction and it works on my Firefox 1.0.7. Here is my modifications: #sidebar { width:100%; background-color: #99; /* float:left; */ } #sidebar li { margin-left:20px; } It looks nice on Firefox: http://img354.imageshack.us/my.php?image=4divfinal5ku.png but not in IE6: http://img252.imageshack.us/my.php?image=4divfinalie64rv.png Thanks you again DinhOn 9/24/05, Bert Doorn [EMAIL PROTECTED] wrote: G'dayAs you can see I intend to set the width of the container and the bannerinto 75% and push them to the left. I intend to reserve the space availablein the right after that for the sidebar whose width is set at 25% and positioned to the right. But unfortunately, the sidebar has floated to theright but it is always positioned under the banner.A couple of things you might try:1. Float the sidebar left instead of right 2. Don't float the sidebar at all.3. Give the sidebar a little less than 25% width (e.g. 24%),Somebrowsers cannot add upRegards--Bert Doorn, Better Web Design http://www.betterwebdesign.com.au/Fast-loading, user-friendly websites
Re: [WSG] Extending xhtml strict to include frameset and target
Thank you Christian, making the top frame a php include sounds like an excelent idea. The markee I was thinking in turning it a flash object, since there is already a flashmovie in the first page it shoudn't be a problem for users, I think it uses less processing resources. From what I've read around the web, it seams it is not mandatory to use !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Frameset//EN DTD/xhtml1-frameset.dtd as a doctype to use on framed documents if I extend the markup and use the right module, it even seams to be the all idea of thex part of xhtml. But then again, all this reading got me confused,I mightbe gettingit all wrong. I'm using the frameset doctype, just wanted to do it a better way, or at least understand it. Best regards, Isabel Santos
Re: [WSG] Extending xhtml strict to include frameset and target
If you keep the frames-based layout and go with a frameset DTD for the frameset and a Strict DTD for the framed documents, you'll run into these problems: 1. IE will create an horizontal scrollbar in your top frame. The fix for this is to use scrolling=yes (I know it's weird). 2. To use target with a Strict DTD, you'll have to extend the DTD or the markup will not validate, but doing so - in my experience - will make your CSS fails validation (I know it's weird). You could use the DOM to plug the target attribute where needed, but I don't think you want your navigation to rely on JS. You could also try base target= if all your anchors target the same frame (I guess that would pass the Validator). I would dump the frameset and go with flat pages. That would have the other advantage of removing one of the 2 vertical scrollbars. Regards, Thierry | www.TJKDesign.com Isabel Santos wrote: Ok, maybe I'm being lazy, I'm googling for a good tutorial or exemples on the subject, and all I find is theory, so here it goes: I recently got a job as a web designer in a company whose site has previous decades markup. Apart from that I do all the companys graphic work, so time is short. The site has a ancient php seach engine, with a quite large data base, and the rest seams more like php output saved by the browser. It has tags for marqees, atributes like blink, links inside a flash movie, lots of heavy animated gifs, a script running at the status bar, an interface completly unrecomended for epileptic users well, I think you can imagine, or visit it at: http://www.ocean-wings.com/ The site is updated every day, since new models como in all the time, and has a quite large and loyal audience, wich by the stats includes users with FF, IE 5 to 6, IE ad Safari on mac (actually not bad at all). The updates are made directly on the markup, update dates are written by hand and the data base is updated separatly, so not only the error risk is significant, but also tasks are unnecessarilly repeated. Such a heavy site is running on frames witch makes all the sense, and some deeper links use the target attribute. I intend to rewrite the site completly to simplify the updating tasks and to make the site faster, more relyable, usable and accessible. I also intend to do in in standards mode. The company intends to keep the look and feel of the site, for it has already a very good emotional boundage with the users, so layout changes should be minimum, only to permit some features they intend to offer, like automatic alerts on updated items for subscription users. Since time is a short resource, my idea is to do it in two fases, in my spare time: First rewriting the site as a template in decent code, then turning it into php buiding a new database and using the template as an output container. So now I'm looking for a doctype I can use to include a frameset and target attributes in xhtml strict mode (not only to trigger standards mode, but also for me to be able to track any markup error). And I'm rulling out transitional doctypes as an option. W3C presents a lot of information on extending xhtml, but nothing I can learn or understand in a quick way. There are also several discussions over the matter on very good blogs, but all I need right now is an example doctype, or a tutorial, on how to extend XHTML strict to include frameset and target external modules, and I cannot find one. Can some of you folks help me, please? Thank you, best regards, Isabel Santos ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Extending xhtml strict to include frameset and target
Using flash for the marquee sounds like a great idea, and will probably be more attractive. I couldn't find the search page you were talking about. Could you give me a link directly to it? On 9/24/05, Isabel Santos [EMAIL PROTECTED] wrote: Thank you Christian, making the top frame a php include sounds like an excelent idea. The markee I was thinking in turning it a flash object, since there is already a flashmovie in the first page it shoudn't be a problem for users, I think it uses less processing resources. From what I've read around the web, it seams it is not mandatory to use !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Frameset//EN DTD/xhtml1-frameset.dtd as a doctype to use on framed documents if I extend the markup and use the right module, it even seams to be the all idea of thex part of xhtml. But then again, all this reading got me confused,I mightbe gettingit all wrong. I'm using the frameset doctype, just wanted to do it a better way, or at least understand it. Best regards, Isabel Santos
Re: [WSG] IE MAC just won't play ball!
I think the problem here might have to do with the fact that your XHTML is invalid. Please run every page through the validator and fix all the errors. There are definitely elements on every page that have not been closed, and I think they are causing all the problems. On 9/24/05, Adam Morris [EMAIL PROTECTED] wrote: HELP! I've just done a site for http://www.charismalab.com. Everything is great for Windows PC, Firefox, Safari BUT the client is looking at the site on her Mac OS 9 IE 5 and it's not right. I've use the import to use a separate style sheet which helped massively but there are some things that I just can't seem to make work! I've downloaded the classic mac IE and can't see what she sees .eg. apparently, the nav line on the bottom of each page breaks off and starts a new line (!) and I've given up on trying to make the wrapper stretch 100% so I'm going to simply give each page a separate wrapper and give it a fixed length, but things still aren't right... can ANYone see where I'm going wrong??? the mac ie css is http://www.charismalab.com/ie51.css Thanks... Adam
Re: [WSG] Extending xhtml strict to include frameset and target
Well Christian, it is not a search page, is a search engine, you can find its form at the top of this page: http://www.ocean-wings.com/principal.htm And the first time I looked at this site I didn't notice that the oval circlesat the animation on the first page were actually links to get in the site itself. I allready convinced the client that that page ( http://www.ocean-wings.com)will need to be completly changed. On 9/24/05, Christian Montoya [EMAIL PROTECTED] wrote: ...I couldn't find the search page you were talking about. Could you give me a link directly to it?
Re: [WSG] Extending xhtml strict to include frameset and target
Oh wow, that page is going to give me a seizure. I can't look at it anymore. You were saying the client doesn't want to change the look of the site, because it has such a loyal user base. I think the users like the site because it is very useful for them, not because of the appearance. I don't think you should worry about the reactions of the users to changes in the site's appearance. As long as the site still works for them, and the navigation is still the same, it should be fine. On 9/24/05, Isabel Santos [EMAIL PROTECTED] wrote: Well Christian, it is not a search page, is a search engine, you can find its form at the top of this page: http://www.ocean-wings.com/principal.htm And the first time I looked at this site I didn't notice that the oval circlesat the animation on the first page were actually links to get in the site itself. I allready convinced the client that that page ( http://www.ocean-wings.com)will need to be completly changed. On 9/24/05, Christian Montoya [EMAIL PROTECTED] wrote: ...I couldn't find the search page you were talking about. Could you give me a link directly to it?
Re: [WSG] Extending xhtml strict to include frameset and target
Hi Thierry, thank you very mutch! I still dont know how to extend the DTD, but you are giving me very good reasons not even to try it. (I hate when things get weird :) ). That's quite helpfull! There is always a good reason why experienced designers do not use some structures, I think I'll stick to the safe frameset doctype. Now about dumping the frameset, it would be nice, scripting cross frames is far more complex than within one document and would save me a lot of work. It would also permit me to give more flexibility to the layout witch is important to me (as long as at 1024x768pxin default text size things look the same they wouldn't even notice it) and frames will keep me from doing that. On the other hand, the top frame has actual content, heavy one, that will change from time to time, but that will stand on top of every page at the site. If I made it a single page, the content of the top frame would be reloaded on every page. And the company loves nice heavy blinking banners. To avoid loading heavy banners every time I would have to make them backgrounds on the css (to keep it cached). That would subvert thefunction ofthe css files, not tomention I would need to update the css to change the pages content. Also users are used to that vertical scrollbar (however hugly it may look), they do not need to scroll all the way up a long page to get to the seach form or the navigation bar. So it makes all the sense to keep the frames system: it saves bandwith and time, and keeps the navigationexperience of the users untouched. Although Ido not appreciate frames (probably for not being used to code with them) I must agree with the company, on that they should stay. Thank you, best regards, Isabel Santos On 9/24/05, Thierry Koblentz [EMAIL PROTECTED] wrote: If you keep the frames-based layout and go with a frameset DTD for theframeset and a Strict DTD for the framed documents, you'll run into these problems:1. IE will create an horizontal scrollbar in your top frame. The fix forthis is to use scrolling=yes (I know it's weird).2. To use target with a Strict DTD, you'll have to extend the DTD or the markup will not validate, but doing so - in my experience - will make yourCSS fails validation (I know it's weird).You could use the DOM to plug the target attribute where needed, but I don'tthink you want your navigation to rely on JS. You could also trybase target= if all your anchors target the same frame (I guess that would passthe Validator).I would dump the frameset and go with flat pages. That would have the otheradvantage of removing one of the 2 vertical scrollbars. Regards,Thierry | www.TJKDesign.comIsabel Santos wrote: Ok, maybe I'm being lazy, I'm googling for a good tutorial or exemples on the subject, and all I find is theory, so here it goes: I recently got a job as a web designer in a company whose site has previous decades markup. Apart from that I do all the companys graphic work, so time is short. The site has a ancient php seach engine, with a quite large data base, and the rest seams more like php output saved by the browser. It has tags for marqees, atributes like blink, links inside a flash movie, lots of heavy animated gifs, a script running at the status bar, an interface completly unrecomended for epileptic users well, I think you can imagine, or visit it at: http://www.ocean-wings.com/The site is updated every day, since new models como in all the time, and has a quite large and loyal audience, wich by the stats includes users with FF, IE 5 to 6, IE ad Safari on mac (actually notbad at all). The updates are made directly on the markup, update dates are written by hand and the data base is updated separatly, so not only the error risk is significant, but also tasks areunnecessarilly repeated. Such a heavy site is running on frames witch makes all the sense, and some deeper links use the targetattribute. I intend to rewrite the site completly to simplify the updating tasks and to make the site faster, more relyable, usable and accessible. I also intend to do in in standards mode. The company intends to keep the look and feel of the site, for it has already a very good emotional boundage with the users, so layout changes should be minimum, only to permit some features they intend to offer, like automatic alerts on updated items for subscriptionusers. Since time is a short resource, my idea is to do it in two fases, in my spare time: First rewriting the site as a template in decent code, then turning it into php buiding a new database and using the template as anoutput container. So now I'm looking for a doctype I can use to include a frameset and target attributes in xhtml strict mode (not only to trigger standards mode, but also for me to be able to track any markup error). And I'm rulling out transitional doctypes as an option. W3C presents a lot of information on extending xhtml, but nothing I can learn or understand in a quick way. There are also several discussions
Re: [WSG] Need help on css positioning
Dinh wrote: #sidebar { width:100%; background-color: #99; /* float:left; */ } #sidebar li { margin-left:20px; } It looks nice on Firefox: http://img354.imageshack.us/my.php?image=4divfinal5ku.png but not in IE6: http://img252.imageshack.us/my.php?image=4divfinalie64rv.png The problem with this is that the 'width:100%;' on #sidebar will force it down in IE/win (see: 'hasLayout'[1]}. Deleting 'width' will solve that, but IE/win is buggy so it won't flow #sidebar up past 2 floats anyway. The result: #sidebar won't go high enough. Go back to your original, as it is working in accordance with W3C-standards for floats. A float can *not* go up past 2 floats, so #sidebar ends up in line with #container in all browsers. The solution is to wrap both #banner and #container in a div#wrapper, and define #wrapper {float: left; width: 75%;}. Next, redefine #banner and #container as {float: left; width: 100%;}. Then the sidebar will line up on top, alongside the new #wrapper and in line with #banner, styled as in your original; #sidebar { width:25%; float:right;} The source-order is the same as before, and there's only one extra wrapper-div in there. Working example: http://www.gunlaug.no/tos/alien/test_7160.html regards Georg [1]http://www.satzansatz.de/cssd/onhavinglayout.html -- http://www.gunlaug.no ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Extending xhtml strict to include frameset and target
:) Oh wow, that page is going to give me a seizure. I can't look at it anymore. Like I said, unrecomended for epileptics... (there areaccessibility rules on blinking gifs) Yet the bliking lights have an important meaning for them: They represent the landing lights for airplanes, off if the airplane isn't there yet, blinking from red to green when landing... I don't think you should worry about the reactions of the users to changes in the site's appearance. You're probably right, but I'll need to go slowly on that: I like the job, I get to do a all lot of other things besides coding and I don't want to loose it. Once I get a decent markup there, I can change the style sheet anytime ;) . Best regards, Isabel Santos
Re: [WSG] Need help on css positioning
Dinh: The easiest way to fix it is to put the sidebar before the banner div in the markup (you dont need to change anything else, although I think you might wishset magins and paddingson the body to zero, it works ok). But you should not have to change the markup to format the layout, so I think the best way to do it is using negative margins. Anyway the other replys are already explaining it. Best regards, Isabel Santos
[WSG] 'em' versus '%'
Hi I was wondering about the use of em's to determin your font size. What is the difference between using em's or percentages? Percentages work fine for me but W3C seem to be very enthousiastic about using em's. And another thing i can't figure out is this: what is the size of 1em? Is it the width of the letter 'm' of a font? Wybe ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] 'em' versus '%'
I believe the size of EM is the default size assigned by the browser, thus if the browsers default font size is 12px then 1em is 12px. Or if you set the body { font-size: 12px; } and p { font-size: 1.5em; } The size would be 18px. Somebody correct me if I am wrong, but this is how I understand it works. Taco Fleur - Pacific Fox an industry leader with commercial IT experience since 1994 . http://www.pacificfox.com - Web Design and Development -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of wybe Sent: Sunday, 25 September 2005 8:02 AM To: wsg@webstandardsgroup.org Subject: [WSG] 'em' versus '%' Hi I was wondering about the use of em's to determin your font size. What is the difference between using em's or percentages? Percentages work fine for me but W3C seem to be very enthousiastic about using em's. And another thing i can't figure out is this: what is the size of 1em? Is it the width of the letter 'm' of a font? Wybe ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] 'em' versus '%'
wybe wrote: I was wondering about the use of em's to determin your font size. What is the difference between using em's or percentages? If http://css-discuss.incutio.com/?page=UsingEms and http://css-discuss.incutio.com/?page=UsingPercentages aren't good enough explanations, let's change them so they are. Percentages work fine for me but W3C seem to be very enthousiastic about using em's. Ems are partiticularly good for sizing container widths, as they make it possible to keep line-lengths the same regardless of font-size: http://members.ij.net/mrmazda/auth/widths-em-v-px.html And another thing i can't figure out is this: what is the size of 1em? Is it the width of the letter 'm' of a font? Here's the official definition: http://www.w3.org/TR/CSS21/syndata.html#em-width -- Cast your cares on the Lord and He will sustain you. Psalm 55:22 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://members.ij.net/mrmazda/auth/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] 'em' versus '%'
I think he meant in the middle of his layout if he uses an em and makes it bigger than the other text. There is no problem with this if its a chunk of text but if you're just using em as a single linesomewhere, then i'd say it was bad. On 24 Sep 2005, at 23:12, Taco Fleur - Pacific Fox wrote: I believe the size of EM is the default size assigned by the browser, thus if the browsers default font size is 12px then 1em is 12px. Or if you set the body { font-size: 12px; } and p { font-size: 1.5em; } The size would be 18px. Somebody correct me if I am wrong, but this is how I understand it works. Taco Fleur - Pacific Fox an industry leader with commercial IT experience since 1994 . http://www.pacificfox.com - Web Design and Development -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of wybe Sent: Sunday, 25 September 2005 8:02 AM To: wsg@webstandardsgroup.org Subject: [WSG] 'em' versus '%' Hi I was wondering about the use of em's to determin your font size. What is the difference between using em's or percentages? Percentages work fine for me but W3C seem to be very enthousiastic about using em's. And another thing i can't figure out is this: what is the size of 1em? Is it the width of the letter 'm' of a font? Wybe ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** Zach Inglis // www.zachinglis.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] 'em' versus '%'
Disregard my last statement, I got the wrong end of the stick ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] 'em' versus '%'
The big advantage of em over % for font size is you can use em to control width of other sections of the web site like line length and container divs. An em is equal to the width of an uppercase M in that font face and point size, except on the web it is 16 pixels or the if the font size has been declare = to the font height. I would suggest that it is to do with the width of an uppercase M in Times New Roman in the default size as the default font for a PC browser. I did a little experimenting a couple of days ago with ems on my blog http://nickcowie.com/2005/about-em Nick This email is from the Department of Consumer and Employment Protection and any information or attachments to it may be confidential. If you are not the intended recipient, please reply mail to the sender informing them of the error and delete all copies from your computer system, including attachments and your reply email. As the information is confidential you must not disclose, copy or use it in any manner. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **