Re: [WSG] Internationalization for hindi (data getting corrupted while sendng from jsp to action)
On Feb 22, 2007, at 4:53 AM, Nisha Kumari wrote: Hi All. I am trying to implement internationalization for my site. But when I am trying to enter some Hindi text in a text box (struts html:text) the value I m getting in my action is not expected one. Getting some corrupted value rather than Hindi entered text. I have set charset to utf-8 in the jsp page. Do I need to do any thing more? Hi Nisha, I don't know Hindi, know no JSP so can't be of help! But something you maybe overlook. Does your Hindi text unicode? Changing the charset to utf-8 directly from the header isn't good enough, you need the document to be utf-8 encoding. In Dreamwever and BBedit, I can change that from Preferences or 'properity'. And the Urdu/Hindi font needs to be Unicode font. If you use PC, Vista maybe come with Unicode fonts but I am not sure about XP though. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Layout Problem: Floating Elements with different heights breaks the flow.
On Feb 21, 2007, at 3:29 PM, Shlomi Asaf wrote:
thanks alot Christian for your answer, u given me data that i
wasent aware about.
What you (and everyone else) need is display:table and
display:table-cell, but unfortunately these features are just not
supported in enough browsers yet.
Well, I used the method for a site. Doesn't work for IE Mac 5.2 but
this browser support was not needed.
Work for IE 5.5 and above, all Gecko broswer except Netscape 4.x
which is expected. IE is given 100% height, overflow hidden, negative
paddings and float. I would say the browser support is good enough to
make it on commercial site.
http://www.browsercam.com/public.aspx?proj_id=325739
http://project.lotusseedsdesign.com/sh-all/home_loggedout-new.html
quick example for your desired layout
#wrap {display: table}
div.content {display: table-row}
div.float {display: cell }
div id=wrap
div class=content
div class=float first column/div
div class=float second column/div
div class=float third column/div
/div
div class=clear/div
div class=content
div class=float first column second row/div
div class=float second column second row/div
div class=float third column second row/div
/div
/div
Safari can be a bit tricky, it seems that without #wrap, other
browser stills display well. For some strange reason, padding didn't
seem to work for .float, as a result I was forced to use white thick
borders to seperate each block. There were times client requested
blocks position be shifted, thus messed up Safari quite a bit, any
inner content wrap (in my case, the table) without width declared
makes Safari wacky too.
Clear both absolutely needed for each row.
All credit goes to Georg as without his pointer and help, I was not
able to do my job for this layout.
Hope this helps!
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] CSS opacity filter
On Feb 17, 2007, at 4:59 PM, Christian Fagan wrote: Thanks for your response Tee. Good work for actually finding the style sheet attached to the drop down menu in example 1. I believe filter does work for Opera, and absolutely for Safari. As of IE 5.5+, I don't believe it works unless you have declared IE's Proprietary Filter, which I don't see in your style sheet, and I don't see you have used conditional comments to serve IE. Good to hear that it works on Safari but the IE issue is baffling. why, if the style sheet doesn't contain the correct Proprietary filter would it display perfectly in IE 5.5+??? I have seen it work on at least 6 other computers so definitely not just me and my and my dodgy browser... Hi Christian, Sorry, my mistake You already included IE's Proprietary filter directly in your CSS filter: alpha(opacity=60); So you are right that it works for IE 5.5 + - I see it works for IE 6 and 7. I never use any other IE's Proprietary filter except the Alpha PNG filter once or twice which I have it inserted in conditional comments, so when I wrote my mind was occupied by CC, didn't see that you have already included it in your stylesheet. My Standalone IE 5.5 couldn't launched, sorry I can't check that for you. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] site check in IE6 - c7designs.com
On Feb 17, 2007, at 11:03 PM, Chris Gandolfo wrote:
http://c7designs.com
Hi Chris, looks good in IE 6. Nice design too!
The font size is too small for my taste, the line-height can be
tighten a bit, headings need bigger margin or padding (padding is
better) on the left - the content area as a whole should be given
bigger left padding, perhaps align with the p in porfolio; last
paragraph needs at least 25px padding bottom. I wish to see DD's text
font size in Resume be the same as the paragraph in About and Hire
Me. I am the last person on earth you want to ask for English
spelling/grammar check :), still, I caught a spelling error, I think
in your horizontal menu, the 'PORFOLIO' is missing a T.
Markup wise, you can eliminate the 'text' class. Instead write a
descendent of #content, like so
#content p {padding: 10px 30px}
and the markup
pI was born in Reno.../p
pI left BM after hig.../p
In the last paragraph, you can create a class to give a different
padding bottom like so
.lastpara {padding-bottom: 30px}
p class=lastparathis is the last paragraph of text that has 30px
of padding bottom/p
Alternatively, you can give #footer_outer a 30px padding bottom if
you don't want a new class for last paragraph.
You have markup validation errors.
Best,
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] a CSS layout tips - dealing with different widths in columns on each page throughout a site
I posted the below message in another list to share with others. I
truly believe this list needs no CSS tips from me, so my intention is
to seek improvement and suggestion for my solution.
Thought I share with you now just in case I never able to come out
with layout tutorials that I'd been wanting to write.
Most of my CSS coding works, dealing with complex layouts that almost
every page needs its own set of code, and the frustrating part is that
the job has always been work in progress status, meaning clients
give me a page or two to begin with, I code it, few days or a week
later, more pages come in that often time requires me to re-work the
code for previous pages because of different widths or colors for
certain blocks. I charge by hours, that means I can simply invoice
whatever changes needed to make, but I really hated it because I hate
wasting my time and wasting client's money. So over the months I have
came out a solution that I think work quite nicely.
For example, I was coding for a project that is 3 columns, I decided
the home page needs equal height (using the technique I learned from
Georg Gunlaug) because there are vertical borders separated 3 columns
and the lines touch the header and footer; background color in columns
needed too, on which there is also a body background color for the
site. I received four pages, of which 3 pages have different widths in
columns in each page and the colors differ in fonts and certain
blocks, and the inner pages need only one vertical border for left
column, but without touching the header and footer. Today I received
another page that is in four columns.
As we all know, IE needs width declared in most cases or you will find
yourself to want to kill Bill Gates or kill yourself. Under such
circumstance working with uncertain layouts on each page, if I were to
markup the page in such way
div id=left/div
div id=middle/div
div id=right/div
I will have to create extraneous code for each page.
My solution for this layout is such
/* positioning in command */
div.floatbox {float: left}
div.floatbox_right {float: right}
div.w185 {width: 185px }
div.w385 {width: 385px }
div.w200 {width: 200px}
div.w220 {width: 220px}
div.w550 {width: 550px}
/* watch how I make myself look pretty */
#left {...}
#left h3 {...}
#right {...}
#right ul li {...}
#right p {...}
#middle {...}
#middle h4 {...)
#middle p {...)
and the markups for three columns look like so:
div class=floatbox w185 id=left
p left content here.../p
/div
div class=floatbox w385 id=middle
p middle content here.../p
/div
div class=floatbox_right w220 id=right
p right content here.../p
/div
with four columns or two columns, all I needed is to add or remove a
set of floatbox.
Basically the headings, ul, dl, ol and p tag are controlled by the
ID's descendants, but classes' descendants sometimes are added with
declaration of '!important to overwrite the ID's descendants to avoid
creating extra set of ID just to achieve presentation needs.
Although I am quite happy with the solution I came up, but I
understand it's by no means a perfect solution , therefor I hope you
can give me your input to make it even better.
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] a structural markup question - revisit
Hi, I just wanted to make sure I am not overly obsess with DL. After I finally learned how to used the DL properly, I have used it so sparingly in many websites in the past few months. I learned, the DL is good for dialogues, for product teasers, but how about this (http://www.alistapart.com/topics/code)? BROWSERS (44 articles) Does your content travel well?... CSS (81 articles) Using Cascading Style Sheets (CSS) ... I remember the first time I learned about the use of DL was actually studying ALAP's source code, and I remember it used to be marked up this way in the old site dl dtBROWSERS (44 articles)/dt ddDoes your content travel well?.../dd /dl It is now with h2 and p tags. My uncertainty is that, within a page, structurally, it really should have only one h1, h2 and so on within an ID selector. So having so many set of h2+p isn't structural. I am thinking perhaps using the following makes it more structural sounds and the em gives more weight for SEO. pemBROWSERS/em/p pDoes your content travel well?.../p But I just can't get over with the DL :-) tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] blockquote in xhtml strict
Hi, I have a block of text that uses blockquote u I came because this is one of the best.. - john doe in my markup: div img src=images/jd.jpg alt=john doe width=83 height=58 / blockquoteI came because this is one of the best.. span- john doe/span /blockquote It gives me validation error: You have used character data somewhere it is not permitted to appear. Mistakes that can cause this error include putting text directly in the body of the document without wrapping it in a container element (such as a paragraph/p) or forgetting to quote an attribute value (where characters such as % and / are common, but cannot appear without surrounding quotes). After some reading about 'blockquote' element in xhtml strict from google search, I added p tag and removed the span pblockquoteI came because this is one of the best.. span- john doe/span /blockquote /p now it gives me this: The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element. One possible cause for this message is that you have attempted to put a block-level element (such as p or table) inside an inline element (such as a, span, or font). What am I missing? Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] print style sheet with dropdown menu
On Feb 11, 2007, at 9:28 AM, Christian Montoya wrote: If you have pages with articles on them, usually the user wants to print the actual articles. The typical trend (and the one I followed when I designed a print stylesheet) is to remove the navigation completely, and just print the title of the page and the article. If users really want to print a sitemap, then you could just make a sitemap page! Hi Kevin and Christian, Thanks for the suggestion. The site has a site map and there is breadcrumb, so I guess the navigatino is not needed. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] blockquote in xhtml strict
On Feb 11, 2007, at 11:09 PM, lisa herrod wrote: On 12/02/07, John Faulds [EMAIL PROTECTED] wrote: Hmmm I thought the dash would have thrown an error...? No? It depends whether it's been typed in directly via your keyboard (the key next to the 0) or whether it's a character that's been copied from another program (like Word) and needs converting to something like ndash; . Thanks john, yes. So Tee, which was it? Hi Lisa, John's assumption has its place ( have experienced that quite often whenever clients sent me texs in Word) but not with this particular case. I had the blockquote tag wrapped inside the p tag. It should be other around as George, Christian, Dylan and Mike pointed out. Always have difficulty to understand the error message the markup validator shows, English as the third language has making it even worse; I am always grateful I can seek for help from this list. Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Coding for chinese audience
Tom, I have coded for Chinese HTML newslestter with UTF-8 using inline style sheet and maybe able to help out, let me know. GB 2312 and Big 5 have lots of unseenable issues that usually to do with users' email clients, especially yahoo, hotmail, msn and many bunch of Chinese webmail such as sina, 126, 136. I have know that UTF-8 messes up hotmail and msn, largely due to the users don't know how to change text encoding in their browsers. What geographic is your targeted audience and are they large percentage users using webmail? tee On Feb 8, 2007, at 1:42 PM, Tom Livingston wrote: Due to email issues, i repost: Hi list, Please reply off-list as this is OT - but I am desperate (sorry list-dads/moms) Can anyone help me prepare for coding an HTML email for a Chinese audience? I have never done anything with Asian characters before. I am on a Mac using DW8 (code view). Any help would be appreciated. TIA *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Coding for chinese audience
On Feb 8, 2007, at 1:42 PM, Tom Livingston wrote: Hi list, Please reply off-list as this is OT - but I am desperate (sorry list-dads/moms) My sincere apology - I really meant to send it to Tom. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Art and accessibility - my opinion ;)
On Feb 1, 2007, at 12:06 PM, Rob O'Rourke wrote: Accessibility is making a site available and usable to the widest possible audience, on as many user agents as possible. A lot of the sites you've picked are pure flash, while these can be made somewhat accessible (e.g. making the text selectable and perhaps some text resizing options, not playing loud music as soon as I open the site, I don't really know much more about making flash accessible...) the point is these sites will never be as accessible as properly done html/css sites. I couldn't use most of those sites from my mobile phone for example, whereas with html a stylesheet with a media type of 'handheld' could be implemented with no changes to the html. Basically you can only use most of those sites if you can see and are using a mouse. There are lots of levels to accessibility that I'm still plumbing the depths of. In terms of the web usability/ accessibility/code/design all need to work together in the right balance because its kind of an omni-media. You can't lump it into any one category other than 'web'. And, like Christian says I'm not sure what you're asking this list for with regards to those sites or your idea... Do you want to discuss web standards and accessibility with regard to those sites? or do you just want to know if we think they're pretty/usable? What is your opinion on web accessibility? Rob Nicely put, Rob :) Oh by the way, one of the site (mandchou.com I think) gave me this error: A script in this movie is causing Adobe Flash 9 to run slowly. If it continues to run, your computer may become unresponsive. Do you want to abort the script (YES no) . I think the about message speaks abit about how bad the usability and accesibility for your eye-catching sites? They are pretty though, no doubt about it. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] text/background color disappering in IE 7
In this page:
http://project.lotusseedsdesign.com/sh-all/bookmarks_listview.html
the below lines of texts and background colors are disappearing in IE7:
rsf1977 posted 1 hour ago at 09:52 PM PST on Jan 23, 2007
{background: #ff9899; }
mamepyon originally posted 3 months ago at 10:33 AM PDT on Oct 24,
2006 {background: #ffcccb;}
If I mouse over to the affected area, it shows up.
This seems to be a common bug of IE 7, when background colors are
declared in each div, the one on top, the texts and the background
colors are not showing up. I have had similar problem before with
other sites, and the fix was to declare relative position with z-
index, or with width.
With this particular layout, the above methods aren't work quite
well. If width is declared (other than auto), the problem get
solved, howeverI really do not want to declare value for width here
(it is set to auto so that the background spreads horizontally from
left to right) because the classes for this two lines are connected
to application component and use everywhere within the site, so if
the width declared, it may mess up other page and complicate thing
for the programmer.
If I declare relative position and z-index, it solves the problem
nicely, but creating another problem in IE 6, that the background
colors won't spread to the edge of the right side. I figure I can
declare width just for IE 6 to counteract, but then it goes back to
square again because I tried to avoid declaring width to begin with.
Here is the code and the filename for the style sheet is
multiple_bookmarks.css
div.latest_poster, div.original_poster {
clear: both;
padding: 0.3em;
margin: 0px;
font-size: small;
line-height: 25px;
color: #555;
width: auto;
display:block
}
div.latest_poster {
background-color: #ff9899;
}
div.original_poster {
background-color: #ffcccb;
}
The site is having a redesign, and the page above is for the new
layout. The above style sheet is from the existing site that was not
coded by me , my task is to utilize most of the old codes as much as
possible and clean up the mess. If you click the home from the
above page, it will bring you to actual site that has more bookmark
listings, and the problem I am having seemed to be affecting mostly
the first bookmark listing.
Any help greatly appreciated
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] css conventions
On Jan 25, 2007, at 5:33 PM, Michael Turnwall wrote:
I have a co-worker, that whenever he creates a class, puts div in
front of it if the class is being assigned to a div. Here's an
example:
div.container {
background-color: #fff;
margin-bottom: 18px;
}
div.container div.container_inner {
border: 1px solid #bbb;
margin-left: 8px;
}
div.container div.inset {
padding: 3px;
}
As you can see, the code can get messy rather quickly. He says he
does it to avoid conflicts. My argument is that you should only do
that when you specifically want the class only to apply to a div.
If I want to use the class on another element I can't without
creating a new rule. I would think the better way would be to
create the class without the div. part first and in the future
add the div. part if I need to be more specific. This allows the
CSS to be more generic and cleaner.
Any thoughts? Do you think the above code is good, bad, doesn't
matter and why
Interesting question. I do this a lot too, actually it has become a
habit for me to differentiate inline classes. I think it also depends
on the complexity of the layout, for example, I am responsible for
CSS coding for a social bookmarking site, in which, many sections
shared common elements but different colors in pages to differentiate
tags, bookmarks, people, sites, blogs and so on, and with each
section, sometimes within the same page, or with different pages, has
different requirements for presentations purposes but still share the
same common elements, they are interwined within the site; on top of
this, I also need to seperate the code within code from layout to
presentation, because one set of code (for positioning) is used to
hookup the application (the programmer wishes is to use the same id
or class for one component throughout the entire site but with the
complexity of layout sometimes it gets very tricky and challenging me
to do ) and the other for presentations (colors, font size etc). I
rarely get a chance to use ID but classes and the example you posted
has been highly useful and effective for the purpose.
I don't see anything wrong or see why it can get messy if a
stylesheet is well organzied and well commented. For a fairly simple
straight forward layout, I can see your reason and agree.
I would love to hear what other say about this, especially those who
are involved with very complex, large portal or web 2.0 social
bookmarking sites.
Best,
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] PNGs in CSS background images in IE6
On Nov 27, 2006, at 5:52 PM, Geoff Pack wrote:
Has anyone had any success using AlphaImageLoader with PNGs in CSS
background images in IE6?
Hi Geoff,
I did one sometimes ago.
for non IE
#header h2{
background: url(images/logo.png);
height: 205px;
width: 294px;
position: absolute;
z-index: 300;
left: 300px;
top: 88px;
}
#header h2 span {display: none;} /* FIR p/s. text indent with
-3px probably works better*/
for IE 6 and 5.5
#header h2{
height: 205px;
width: 294px;
position: absolute;
z-index: 300;
left: 300px;
top: 88px;
background-image: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='common_images/logo.png'), sizingMethod='scale');
}
and the markup looks like this:
div id=header
h2spanCompany logo/span/h2/div
The reasons I used the h2 with absolute positioning was because : 1)
company name for SEO; 2) I find placing image in a descendent of a
div easy to controlled as far as absolute positioning concerned
Hope this helps
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] WebSite Feedback
On Nov 22, 2006, at 3:36 AM, Luke wrote: I would like to remind you that there is a advertisement in you e-mail signature. Your message implied that the message from Marvin was a disguise and that his true intention was to advertise some service. FIY, webmails like Yahoo, hotmail, MSN and many others auto insert advertisement at the bottom of the email and Marvin was using hotmail - there is nothing he could do about the advertisement accept unsub from hotmail. If it bugs you, you have the following options 1) unsub; 2) make a complaint to WSG admin, have them block members who use yahoo, msn, hotmail and so on - let's pray god that your voice is heard and your existence at WSG is essential to the WSG existence so that it makes certain your compliant be heard and action be taken accordingly by WSG admin; or 3) be tolerate; nobody steps on your toes. And I would like to ask, which one annoys you most: 1) people who use html email with his/her big company logo and listed 20 lines of the service he/she offers 2) people who didn't turn off vacation notice 3) people who don't trim their messages in reply 4) people who uses hotmail or other webmail services and is innocent like Marvin but being accused by you Sincerely, Tee G. Peng *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] ie dev tool for ie 6 standalone?
Hi, I got the IE 7 and IE6 standalone running, and is very upset to find the IE dev tool no longer working for IE 6 standalone. Is there a way I can make it work? Really need this tool for troubleshoot IE 6 layout problem. Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Hardware/OS setup recommendations
On Nov 17, 2006, at 10:12 PM, John Faulds wrote: I'm after something that provides maximum flexibility when it comes to testing in OSes, browsers, screen resolutions. Am I able to do this with just one machine, e.g. a MacBook Pro running Parallels or a PC running some VM software or do I need to have separate machines? John, as a freelancer myself I find having a powerful laptop with a reasonably big screen monitor when work at home really useful and productive. I sometimes need to meet clients at cafe or their offices, able to show them the work from my own computer to clients is really important for me. I have a Macbook Pro with Parallels installed, also have a browsercam- pool shared account (don't use it often but I realized it's good to have when my clients couldn't understand my repeated telling them what they see is not what other see from their monitors and browsers ) and an old PIII Dell PC I picked up from ebay few years ago but these days I rarely use it for browser testing because startup XP from Parallels is so much easier and convenient. Parallels Workstation is a fine product, runs very smooth and fast. As a Mac lover I would say go with the Mac however, if you are a PC user, the cost of switching maybe a bit higher. On the other hand, there are so many open source software at your disposal , and many shareware writers deliver high quality, affordable Mac software that don't really cost an arm and a leg. What I really appreciate these shareware writers is that, they produce something so nice from machine they truly love, take TextMate, CSSedit for example. State of the art is the word. Get rid of Apple Mouse though, that is a piece of pricey junk. Likewise with monitors: do I need to have more than one or will one suffice as long as it's sufficiently large enough? If you go with a laptop, having a monitor certainly is a wise choice. Good luck with your upgrade tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] border-collapse
Accordign to CSS2 spec, 'border-collapse' inherits from parent, but
it doesn't work for my browsers at all.
Here is the screenshot from Firefox.
http://project.lotusseedsdesign.com/bc.png
table {border-collapse: collapse}
and my new toy CSSEdit gives me validation error for the above
declaration.
Does it means no browsers support it?
Thanks!
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] border-collapse
Hi Lachlan,
On Nov 12, 2006, at 1:08 AM, Lachlan Hunt wrote:
It's impossible to tell what the problem is, all modern browsers
support border-collapse. It may just be that you need to remove
the border from the table cells.
th, td { border: 0; }
Thanks! Found the culprit. I forgot to close my comment above the
'table' (3 lines above). My CSSEdit didn't pick that up, instead, it
warned me the '
table {border-collapse: collapse}
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] safari version of an IE underscore hack
u mailto:[EMAIL PROTECTED] wrote:
Does anyone know of a hack for safari that will enable the css to
display ONLY in safari?
#mydiv {
width: 500px; /* for Safari */
}
/* all other browsers - Safari ignores rules with a hash/pound
after the semi-colon */
#mydiv {
width: 800px;#
}
Hi Matthew Pennell,
try use :
::root p { color: #000; /* only safary */ }
Hi Matthew, I needed a safari hack for a tab navigation that is
either 1px short or longer than the other browsers . Google it and
found a few :
http://www.simiandesign.com/blog-fu/2005/11/safari_css_hack.php
http://www.ibloomstudios.com/article1/
http://www.stuffandnonsense.co.uk/archives/hide_css_from_safari.html
regards,
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG CMS] AJAX Editor anyone?
Hi Peter, I was going to recommend textmate, but realize it doesn't has PC version http://www.macromates.com/ Regards, tee On Nov 9, 2006, at 2:32 PM, Peter Firminger wrote: Well, Peter, I think you'd just need to attach one of the WYSIWYGs to the textarea you create on-the-fly, the only difference would be raising the onload/initialization events not after a page loads, but after you replace the text element with the textarea element, it sounds pretty straightforward in theory. This is the problem. I am really not good at JavaScript and all my attempts have failed, hence my asking here. I can't believe that no-one has this functionality available off- the-shelf yet, even to purchase (it's for a large client so paying for it isn't an issue). P ** Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ** ** Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] **
[WSG] We do not support the Safari browser yet
Was doing a research on real estate related websites from Safari browser, and encounter a site called zillow, and it brings me to this page: http://www.zillow.com/static/pages/BrowserSafariNotSupported.html with this message We do not support the Safari browser yet Instead, please use Firefox for the Mac If you don't have it already, please download the free Firefox browser from here: http://www.mozilla.org/download.html and then return to Zillow.com where you can find home valuations and more. For a second I thought I was at IE 4, netscape 4 era. Looking at its code, I do not understand why Safari browser is not supported. Can someone enlighten me? Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] best way to style the Tags?
On Nov 6, 2006, at 8:33 PM, Jan Brasna wrote: What the hell with all those em Graded emphasis. It's described in the linked text that was written by John Allsopp (originally at http://microformatique.com/? page_id=34). Jan, thanks for the link, I finally got a chance to read it... unfortunately the page breaks badly after ' Code conventions The hot tags code looks like this, everything get pushed to the right, due to the background color very close to the gray text, it's impossible to read. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] if you want to do user testing with people with disabilities
This is a piece of information that may interests you. I asked a semi-paralyses client if I can sit with her to see how she brows the internet and work on computer. She gave me an information that some of you who are very much into creating accessible web site for people with disabilities may find extremely useful too. In my area, here are Center for Independent Living where have training program to help people with disabilities use computer with assistive software, and this is the one where client refers me to: http://www.cilberkeley.org I think I can volunteer my skill for its website in exchange for my research :) So if you live in the East Bay of California, please don't compete with me :) You probably can find similar organization in your area if you are interested in doing the similar user testing. Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] best way to style the Tags?
Hi, What would be the best and creative way to style the tags? You know, like those big small, very big, very small words under the 'tags' title. I vaguely remember reading something that tags are invented by technorati, so I went to pay a visit, and totally clueless when I see these in the markup: liememememememememememememememema href=/tag/BushBush/a/em/em/em/em/em/em/em/em/ em/em/em/em/em/em/em/li liemememema href=/tag/ComedyComedy/a/em/em/em/ em/li liememememememememema href=/tag/ DemocratsDemocrats/a/em/em/em/em/em/em/em/em/ em/li liememememememememememema href=/tag/ ElectionElection/a/em/em/em/em/em/em/em/em/em/ em/em/li liemememememememememememema href=/tag/ ElectionsElections/a/em/em/em/em/em/em/em/em/ em/em/em/em/li What the hell with all those em Enlightenment desperately needed. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] best way to style the Tags?
Thanks Emitry and Patrick. That relies completely purely on styling to convey meaning. Not saying that the heavily nested EMs are ideal, but at least they convey meaning in the markup, where your proposed solution only applies a visual distinction to otherwise equal and generic spans. I know my method suck as soon as I saw Ted' example :) Almost make myself a span queen! Curious though, wouldn't Google penalizes the nested EMs method. With my very limited SEO knowledge, it does look like cheating. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] css editor for Mac
Because CSS coding is part of our life, I couldn't resist to want to mention MacRabbit CSSEdit to you. Found it from google search on Friday, purchased it immediately after some 10 minutes of testing, not because it costs only half of StyleMaster, but that it's lightweight and is universal . Today I was invited to upgrade to newest version which, it not just fixed the old version problem I found (and sent 4 emails to the writer in 4 hours) but have many nice new features just name a few here 1) Preview Anything: Blogs, Your Own Web Apps, CMSs 2)X-ray: Your Site In Its Underwear 3) Point and Click 4)Filter 5) Visual cues and more... It really put StyleMaster to shame. disclaimer : I have nothing to do with the company. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 5, 2006, at 10:45 AM, Rob O'Rourke wrote:
Rob, I am playing with your suggestion this moment. Setting height
in EM seemed a very good approach, even for rows that have
different lenght of contents. When I tried enlarge the font size
in Firefox and Safari, it however gives an undesirable space at
the bottom of each row, the same goes to deduce the font size.
I am thinking, perhaps it's best to combine yours and Georg'
suggestion, using table-row and table-cell for display element for
advance browsers, then feeds IE 6 and 7 the height with EM,. IE 7
has zoom feature like Opera, this maybe a more sensible approach?
Seems odd that resizing the font would affect the bottom margins.
Do you have a demo or screenshot? I'll have a go at getting it to
work myself but I think that the table-layout method would be best
for forward compatibility. Keep us posted.
Rob, was experimenting different methods and I must say, using
Georg's method for advanced browsers and height with EM [1] for IE
works appear to be the best for my situation (still need refinement
for the two buggers though!)
I am posting the results for different approaches I have tried.
[1] Better result for all browsers.
http://project.lotusseedsdesign.com/SH-new/home_logoff.html
but with the same page, Safari doesn't like it very much. It places
the header at the bottom, below the display table-row's elements [2].
see screen shot here: http://project.lotusseedsdesign.com/SH-new/
safari.png
The 'display: table-row' is declared in the 'div.content'. With each
row, the two columns (.left_col and .right_col) have to be wrapped
inside the 'content' or it runs across the browser horizontally. The
markup is such:
div class=content
div class=left_colpopular bookmarks/div
div class=right_colpopular people/div
/div
div class=content
div class=left_colpopular sites/div
div class=right_colpopular tags/div
/div
[2] Further testing shows a very bizarre behaviors that somehow fixes
Safari's problem, by accident - I changed the 'content' from class
to ID in my stylesheet, but forgetting to change it to id in the markup.
[2] http://project.lotusseedsdesign.com/SH-new/safari_fix.html
screen shot for the same page for PC users to get an idea.
http://project.lotusseedsdesign.com/SH-new/safari_fix.png
It works fine for all browsers. And you can see I change the
'div.content' to '#content' in common.css file, and have kept the
div class=content in the markup.
While trying to figure out the above problem for Safari, I went back
to study' Georg's code, and realized I didn't have a 'display: table'
for the outer wrapper. From the above working page, it appears that
no 'display:table' makes no difference to browser at all, however I
wanted to find out if that is the reason resulting Safari behavior;
Georg has the declaration in 'equal' class which is the wrapper for
all contents in his example. I don't want the 'display: table'
declare in the #container (the outer wrapper for my page), so I added
a new id (#wrapper)
#wrapper {display:table}
div id=wrapper
div class=content
div class=left_colpopular bookmarks/div
div class=right_colpopular people/div
/div
div class=content
div class=left_colpopular sites/div
div class=right_colpopular tags/div
/div
/div
And yes, it confirms that adding a wrapper with display table does
the trick for Safari,
http://project.lotusseedsdesign.com/SH-new/add_wrapper.html
but so as the [2] did the trick. So I am guessing just the 'display:
table-cell' for left_col and right_col is all it needed (?) because
without changing the div class=content to div id=content for
[2], the div class=content tag has no meaning to browsers and it
appears the 'display: table-cell' from left/right columns are holding
everything together. Still, one mystery needs to be solve: if I
removed the two div class=content tags from [2], the page breaks
even worse in Safari, columns and rows run vertically to the left,
and placing the header section in the middle of the page. (it appears
this browser is full of bugs now - I encounter more problem from it
than the IE lately)
http://project.lotusseedsdesign.com/SH-new/no_contentwrap.html
http://project.lotusseedsdesign.com/safari_2.png
No solution, no conclusion I am afraid. Anyone here studies Safari'
behavior? Is Patrick the man?!
This page is set the height with EM (no content wrapper) for all
browsers that you want to see. The height shrink or expand depending
on the font size increases /decreases. I thought this is the normal
behavior for EM value, not quite understand why you said it shouldn't.
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 5, 2006, at 6:17 PM, Tee G. Peng wrote: I am posting the results for different approaches I have tried. I deleted all images, footer and header as I really shouldn't show the page to public without asking permission from client first (although no NDA is signed for this project). Hope by removing the images I remove the trace of evidences :) tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 5, 2006, at 6:17 PM, Tee G. Peng wrote: Finally comes the one with Georg' method http://project.lotusseedsdesign.com/SH-new/georg_method.html in IE 6, the background images for each block are gone, I think it's caused by (overflow:hidden), whereas in IE 7, the vertical scrolling still exist (with overflow:hidden), and the background images are pushed to the very bottom of the page. Georg, please help! My mistake, placing the overflow:hidden in content' does work for IE 7, but I still can't figure why the background images are not showing up. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Do width and hight still needed for inline image?
Good weekend everyone! I see some sites that don't declare width and hight attribute for inline images and html validotor doesn't give error too. Does this mean we can abandon the two attributes for inline image? Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] how to retain equal height without losing layout integrity when user resizes font size
Hi, I am doing a layout that requires equal height for each column and row, however the contents inside of each column and row are different and in some pages, in certain sections, the length of the content will be decided by end users' data feed. Each column, each row has its own background color (gradient image). I don't want to set 'height' attribute; I maybe able to play with pixel perfect with precise calculation to obtain equal height but when a user resize font size, the integrity will be lost. Here is a mockup screen shot, client got everything precisely line up: http://project.lotusseedsdesign.com/ss.png an untidy layout I just did http://project.lotusseedsdesign.com/ss02.png my markup is such: div class=left_colFirst row, first column /div div class=right_colFirst row, second column /div div class=left_colsecond row, first column /div div class=right_colsecond row, second column /div I was thinking if I insert a wrapper for each row so it looks like so div class=wrapper div class=left_colFirst row, first column /div div class=right_colFirst row, second column /div /div div class=wrapper div class=left_colsecond row, first column /div div class=right_colsecond row, second column /div /div However with different background colors that are controlled by gradient images, it seems pointless to do so. Your suggestion deeply appreciated! Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 4, 2006, at 8:02 PM, Al Sparber wrote: Example: http://www.gunlaug.no/tos/moa_11.html ...which includes IE fixes. Study Roger's article (linked in) and demos for the rest. IE7 wants to scroll the negative margins. There are some scripted solutions that might be easier to manage, so long as the equal columns can be seen as an enhancement. Yeah, Al is right. I see the endless vertical scrolling from IE7. Got fix for IE7 -:) http://project.lotusseedsdesign.com/eqforie7.png Al, I aware you have an equal height script and just went back to take look, can it be used for many columns with rows? I ask because of the reading from 'the script argument' paragraph. The in-house programmers maybe able to come out something similar but if they don't know how to hook up id and class for dl element, it may be better not to count on them. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 4, 2006, at 8:22 PM, Rob O'Rourke wrote:
Hi Tee,
If those blocks always contain similar output you could float your
blocks left to stack them up and set the height in ems. Seems to me
the easiest way to do a layout like that.
e.g.
div id=container
div class=left id=bookmarks/div
div class=right id=people/div
div class=left id=sites/div
div class=right id=tags/div
/div
and then CSS like:
#container { width: 830px; } /* to leave a 30px gap in the middle
e.g. |400px| 30px |400px| */
.left, .right { height: 60em; width: 400px; margin-bottom: 30px; } /
* whatever your dimensions need to be */
.left { float: left; clear: left; }
.right { float: right; clear: right; }
That way your blocks have equal height and width, will stack as per
the image and you have a nice semantic unique id on each to apply
styles with. Might need some tweaking for cross-browser goodness
but in a fixed width layout that code should be safe to work from.
Rob, thank you very much! I will play with your suggestion - more
homework for tonight I am afraid :)
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] how to retain equal height without losing layout integrity when user resizes font size
On Nov 4, 2006, at 8:22 PM, Rob O'Rourke wrote:
and then CSS like:
#container { width: 830px; } /* to leave a 30px gap in the middle
e.g. |400px| 30px |400px| */
.left, .right { height: 60em; width: 400px; margin-bottom: 30px; } /
* whatever your dimensions need to be */
.left { float: left; clear: left; }
.right { float: right; clear: right; }
That way your blocks have equal height and width, will stack as per
the image and you have a nice semantic unique id on each to apply
styles with. Might need some tweaking for cross-browser goodness
but in a fixed width layout that code should be safe to work from.
Rob, I am playing with your suggestion this moment. Setting height in
EM seemed a very good approach, even for rows that have different
lenght of contents. When I tried enlarge the font size in Firefox and
Safari, it however gives an undesirable space at the bottom of each
row, the same goes to deduce the font size.
I am thinking, perhaps it's best to combine yours and Georg'
suggestion, using table-row and table-cell for display element for
advance browsers, then feeds IE 6 and 7 the height with EM,. IE 7
has zoom feature like Opera, this maybe a more sensible approach?
Regards,
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] display: table causing Gecko based browsers extra space for
On Oct 31, 2006, at 8:45 PM, Philippe Wittenbergh wrote: One thing though, the 'display:table' only work when declared in both dt and dd. Without 'display:table' http://new.marinersq.com/html/aerobics_test.html With 'display:table' http://new.marinersq.com/html/aerobics.html Gecko (Firefox 2.0) is doing something strange with that display: table, as if it inserts an extra table-row before the link, inside the dt. When I check that on a recent Gecko trunk build, that doesn't happen (means: a bug has been fixed). As for Safari, it does also has a bug there (also fixed in recent nightly builds). Instead of using 'display:table' to establish a block formatting context, try using 'overflow:hidden'. That doesn't cause any problems in any modern browser here (Opera, Safari, gecko). You might want to hide that from IE 6 and maybe 7. Thanks Philippe, with display:table removed, the overflow:hidden works for all. Thierry actually suggested using it too, but I misunderstood him as only using the overflow:hidden if there is problem in IE. I'd just notice another problem with IE 6 and 7, that the content is hidden when the DL' element (with toggle off) is shorter or longer than the floated box's content. http://new.marinersq.com/ie.jpg same problem can be found on this page too Was drawing my luck on all possible IE fix (position relative, display inline, display table, display inline-table, zoom 1/100, overflow hidden and so on). NO luck! Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] list-style: decimal
Hi, I try to use 'list-style: decimal' for the first time. The list has some 15 items, at tenth, it goes with '0' and the following items start from 1, 2, 3... again. The W3C CSS 2 spec about list style for decimal is vague. http://www.w3.org/TR/REC-CSS2/generate.html#lists decimal - Decimal numbers, beginning with 1. Except from adding the numbers, any other way I can do? Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] list-style: decimal
On Oct 31, 2006, at 2:58 PM, Mike at Green-Beast.com wrote: Hello Tee, Unless I'm missing something, if you want a numbered list 1-15, just use ordered list element: ol ol liList item one/li liList item two/li [...] liList item fourteen/li liList item fifteen/li /ol It'll number the list as you want without having to specify anything. Mike, Thanks so much I completely forgotten there is OL at my disposal. Never use it though. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] list-style: decimal
On Oct 31, 2006, at 3:10 PM, Tee G. Peng wrote: Unless I'm missing something, if you want a numbered list 1-15, just use ordered list element: ol ol liList item one/li liList item two/li [...] liList item fourteen/li liList item fifteen/li /ol Hmmm, OL gives a 25 pixel default space between number and the content. There isn't seemed a way to override it, this is really undesirable. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] list-style: decimal
On Oct 31, 2006, at 3:36 PM, Gav wrote: What difference does it make if you used 'list-style-type: decimal' Instead. Gav, I am glad you asked. So I changed back to UL and added 'list- style-type: decimal' to see if it makes any difference, only did I find out the list-style: decimal does work for increasing number but the left margin value causing the problem. Please see this page here: http://new.marinersq.com/html/aerobics.html, You will see the first f digit starts from tenth is missing. Depending on what browser your view, you may see part of the number. In Safari, it's totally gone; with Gecko based browsers, I can see a tiny bit. What was happening was that I had the left margin set to 24px with ' Trebuehet, Arial, san serif and the first digit was missing. With Mike's suggestion, I changed to OL, also changed the left margin to 35px and the font to Georgia so I thought it works. You can use Firefox Developer tool, edit CSS to change the left margin to bigger value to see the effect. Is this how it works or the margin/padding values for the floated box div causing it? tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] list-style: decimal
What difference does it make if you used 'list-style-type: decimal' Instead. Gav, I am glad you asked. So I changed back to UL and added 'list- style-type: decimal' to see if it makes any difference, only did I find out the list-style: decimal does work for increasing number but the left margin value causing the problem. Please see this page here: http://new.marinersq.com/html/aerobics.html, You will see the first f digit starts from tenth is missing. Depending on what browser your view, you may see part of the number. In Safari, it's totally gone; with Gecko based browsers, I can see a tiny bit. What was happening was that I had the left margin set to 24px with ' Trebuehet, Arial, san serif and the first digit was missing. With Mike's suggestion, I changed to OL, also changed the left margin to 35px and the font to Georgia so I thought it works. You can use Firefox Developer tool, edit CSS to change the left margin to bigger value to see the effect. Is this how it works or the margin/padding values for the floated box div causing it? Forgot to say, with OL, it works fine regardless what value I use for left margin. Just checked from IE, IE 6 displays everything but not IE 7 tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] display: table causing Gecko based browsers extra space for
Hi, While you are looking at my the list-style: decimal, can you also check a problem that I haven't been able to solve? I use Thierry's toggled elements. It works really nice, but if a floated div inserted, something goes wrong. I want the DL element floats around the floated box when toggled is on; (1) all browses seemed render it correctly except the Safari http://new.marinersq.com/safari.jpg Another thing, (2) the dt has a background image, the contents for dt and dd should line up vertically, but all browsers, including Safari, next to the floated box dd contents, line up with dt's background image instead. Thierry suggested adding display: table or inline-table in dd and dt. 'Inline table' doesn't solves the Safari's problem for (1) but the 'table' does, however it resulting bigger spacing (top and bottom) in Gecko based browsers. playing with margins or paddings doesn't fix the problem. Any solution for this? One thing though, the 'display:table' only work when declared in both dt and dd. Without 'display:table' http://new.marinersq.com/html/aerobics_test.html With 'display:table' http://new.marinersq.com/html/aerobics.html With no floated box, everything works with or without 'display:table' declared. Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] display: table causing Gecko based browsers extra space for
On Oct 31, 2006, at 5:35 PM, Carlos Carreo wrote: make the large of the left colum 100% Hi Carlos, thank you for looking, but I apologize I do not understand which one you are referring to. The left colum I could think of is #content but I don't want it be 100% as this is a two columns floated layout. Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] a js snippet that can generate xhtml/css validation links
But include files won't make the links submit differently (depending on which document host them), and I think that's what Tee is after. Yes, SSIs wouldn't, but ? try !--#echo var=DOCUMENT_URI -- on your SSI-enabled page :-) Thierry wrote a nifty lightweight snippet for me :) It works excellently. http://eto.marinersq.com/?q=multilevel.html The section 508 generates the result for home page but with inner pages, it requres one more click for contentquality.com, I guess it's to do with the way hisoftware handles the validation for external link. Don't mind the validation errors if you see any, as I haven't get a chance to fit them. By the way, I use the Etomite CMS and it does clean markup with strict (x)html. It probably be better to use the PHP to generate validation links, but I don't know how to do it (yet), and I like the fact that I can use the same JS snippet for static HTML site. Cheers, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] a js snippet that can generate xhtml/css validation links
On Oct 25, 2006, at 12:42 PM, Patrick H. Lauke wrote: Chris Williams wrote: Assuming that the user in this case is the developer who is developing the site (the only one who has a reason for the output), then they can unblock it... Oh great, so for the mere mortal users these already cryptic and useless links can become even more useless and cryptic because, when clicked, they then take them to an even more ominous error page? P Patrick, your co-authored book Web Accessibility: Web Standards and Regulatory Compliance has been in my amazon cart for a while and it's likely I will get to read it next month. I first learned the web standards because I was curious, no clue what those 'xhtml', 'css' and 'section 508' about in many websites I visited. My curiosity made me click to find out, further more dive into it. You see, you, and many authors who preach, write about web standards, accessibility need supporter like me, who is a bit of ignorance, a bit naive, but dedicate to try to learn the good. It's not fun to see you poke fun :) Ok, I do see it looks ugly for those links stay in the footer because it looks so crowded there, I will make them less visible later tonight I get back to the project again. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] tabindex doesn't work
Hi, this is the first time I try implementing tabindex for navigation. http://new.marinersq.com/html/thierry.html The above page has 6 menu tabs and I have them set from tabindex=1, tabindex=2 and so on...but nothing happens when I try to tab them. I tried using combination of 'shift', 'alt', 'control' and 'command'. Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] tabindex doesn't work
On Oct 24, 2006, at 1:11 PM, Thierry Koblentz wrote: But did you try *tab*? ;) Yes I did. I have the 'enable tab browsing' selected both in Safari and Firefox. hmmm, embarrassing! I guess the problem is I don't know exactly how to 'tab'. Ok how do you do that in Mac? Works fine for me, but I don't see the reason why you'd use tabindex with this type of menu. How do you reach sub-menus? OK, I was thinking when I tab to programs for example, I use 'up' and 'down' arrows combination to navigate the sub menus. Maybe Al can explain this better? According to his PMM product page, the PMM is Tab key friendly. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] tabindex doesn't work
On Oct 24, 2006, at 1:02 PM, David Dorward wrote: I suggest you: 1: Stop using image replacement. img elements aren't deprecated. Ah! Thanks. This actually was the next question I was going to ask :) I did a check on Yellowpipe online Lynx Viewer and see that it shows the alt text as well as the text for image replacement, and was questioning my choice before you message came through tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] a js snippet that can generate xhtml/css validation links
Hi, I wonder if there is (free) js code out there that can generate xhtml/css validation links that people put at the bottom of their sites. It's quite tedious to make the links manually, page by page. Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] image disappears sporadically on mouse over - site check
On Oct 24, 2006, at 5:07 PM, ~davidLaakso wrote: Taco Fleur wrote: Yes that's the one I mean, I forgot to include a link www.pacificfox.com.au Hi Taco, in Mac, Firefox gives me this error: __ Error Occurred While Processing Request Session is invalid Please try the following: * Enable Robust Exception Information to provide greater detail about the source of errors. In the Administrator, click Debugging Logging Debugging Settings, and select the Robust Exception Information option. * Check the ColdFusion documentation to verify that you are using the correct syntax. * Search the Knowledge Base to find a solution to your problem. Browser Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv: 1.8.0.7) Gecko/20060909 Firefox/1.5.0.7 Remote Address 67.180.107.164 Referrer Date/Time 25-Oct-06 10:21 AM __ If I change to www.pacificfox.com the page loads fine. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] image disappears sporadically on mouse over - site check
On Oct 24, 2006, at 4:23 PM, Taco Fleur wrote:
Forgot to mention, in Safari 2.0.4, a horizontal line showing up on
top of each big button (1. click here to view our portfolio, 2...,
3 4) and the 'mor' buttons. It looks to me it's caused by
a:link {text-decoration: underline;}
as the color is the same as text link you have.
Nice design, but for strange god know what reason I find the page
very noisy. Maybe the guy with glasses and mustache looks too
intimidating to me :) I always find man with that kind of mustache
intimidating :)
Just kidding!
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] a js snippet that can generate xhtml/css validation links
Hi Patrick, On Oct 24, 2006, at 5:34 PM, Patrick H. Lauke wrote: Maybe more of a philosophical question here, but: why would you want those links on all pages (assuming this is client work, yes)? Who are they useful to, if not other developers and/or yourself? Yes, it's for client's site. Not out of fame but perhaps marketing purpose. My dedication with extra hours of work for validating markups, css and section 508 (note, I don't just rely on validation tool but my eyes) on each page pay off, because I got a few gigs from companies and web design firms to do web standards compliant sites :). If I only put a link on the home page, it only mean the home page is validated, not other pages. Clients want their clients/ audiences know that each page is validated and section 508 compliant. Besides, this is a good way to promote web standards I think. It's quite tedious to make the links manually, page by page. Include files are your friend (even humble SSIs, if there's no server-side scripting language available) But include file can't generate individual links correct? for examples home.html http://validator.w3.org/check/referer?http://www.site.com/ home.html about.html http://validator.w3.org/check/referer?http:// www.site.com/about.html I see Chris got me the answer I needed. Thanks, Chris. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] image disappears sporadically on mouse over - site check
On Oct 24, 2006, at 7:13 PM, ~davidLaakso wrote: Taco Fleur wrote: OK, so it appears there are some issues, it would help if you actually point the issues out. I don't have access to a wide range of browsers. Any suggestions? - wasn't there some kind of tool that allowed you to see the website in different browser versions? Hi Taco, you may want to join one of the Browsercam pool from fundable.org http://www.fundable.org/search? SearchableText=browsercamreview_state=publicreview_state=privaterevie w_state=finished-approvedx=0y=0 I signed up my BC's account from there. Of course the most convenient way is to equip with both PC and Mac :) I suppose it's the most sensible thing for a design firm to invest: Get a Mac Pro, then get a Parallels or Crossover :) tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] a new IE bug? maybe not
On Oct 22, 2006, at 7:20 PM, Thierry Koblentz wrote: Tee G. Peng wrote: BTW, the sidebar drops below the main column in IE 6 What OS do you use? I don't see it from my XP nor from browser cam ! Sorry, I should have told you: XP Pro - IE 6.0.2800.1106.XPSP2.030320-1720 Hi Thierry, I asked people to help check the page and they all came back that it's working fine, with XP home and Pro. Can you check again please! This one should be the final working version. http://new.marinersq.com/html/aerobics-3.html The only thing I see that the right column drops to the bottom is when I resize the text to smaller. Is there a way to fix? Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] a new IE bug? maybe not
I experienced something very frustrating and had wasted many hours to find the culprit. Not sure if it's a new discovery or something that is known by many people, thought I share it with you and hopefully it can save you some grieve to try to figure what goes wrong in the future. Was working on a page that uses (PVII) dropdown menu and it doesn't up in IE 6 7. I thought it was my code at question, turned out it was because I didn't upload the SWF file, thus causing dropdown menu not showing up. You can see the page here http://new.marinersq.com/html/aerobics.html Soon as the flash banner uploaded, it shows up fine. http://new.marinersq.com/html/aerobics-3.html Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] a new IE bug? maybe not
Hi Thierry, I believe it is only because the page is hanging (it does not *load*). Sigh! Only if I knew early. BTW, the sidebar drops below the main column in IE 6 What OS do you use? I don't see it from my XP nor from browser cam ! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] html email styling question in body
Hi, sorry if this question sounds too stupid to you, but I really have a hard time to understand the concept being CSS style in the body. I am doing a html email that uses table and inline styling (yes, I have good concept what inline styling is and pretty good at it if I really need to code it that way) because it needs to target most web mails such as gmail. According to campaignmonitor and the excellent article David Greiner wrote for thinkvitamin, gmail only support Tables and inline CSS and this is what I was trying to do for this html newsletter. But I really don't understand what it said about putting CSS in the body. Isn't this the same thing as inline styling? In the article and the links within the article, I found more useful articles and information, my impression from the articles I was reading is that, css in body tag and inline styling are two separate things. I am driving myself crazy to not being able to understand the concept and my poor understanding of English. TIA for your thought and elaboration! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] programmmer said: difination list not a standard practise
On Oct 11, 2006, at 1:13 PM, Patrick H. Lauke wrote: What I'm saying is: the definition list is fine, the additional proposed use of a DL and a UL is probably fine as well, and you could even treat it as a small table (as long as appropriate headings are given for both columns and rows). I see! Thank you for the clarification. Jough made a good suggestion however, in regard with my markup, I have a question here, that a site nature is driven by pictures (products posted by members, and members' photos), it seems to me that image has higher emphases then text; also, we human eyes tend to draw first attention to image than text, so, in a situation that the image itself = the name. I do not feel Jough's proposal appropriate as adding UL for total posts and overall score, and moving person_profile to a div class throw away the structure. Why? I couldn't explain better than Nick showed us: dl class=member_profile dtAvatar Image/dt ddHAS-A username Orang Utandd ddHAS-A total post count of 1012/dd ddHAS-AN overall score of 3028/dd /dl Jough's reason was that the members 'name' defines his/her image. But to me, Orang utan is the 'image' of her, they do not define each other. I did not read the DL spec from W3C site when I worked on that markup, and was not aware I could use two dt in dl. My consideration was that the 'image' has higher emphases over the 'name', so placing image in dt was appropriate at that time of my thinking. Now I suppose I can do dl class=person_profile dtimg src=images/pic-temp.gif alt=p width=26 height=26 / /dt dt class=namea href=#Orang utan/a/dg dd class=postsa href=#1012/a total posts/dd dd class=scroea href=#3028/a overall score/dd /dl - On Oct 11, 2006, at 4:21 PM, Nick Lo wrote: In short the arguments that appear to be coming from the programmer do not make a lot of sense. I say appear as you do not seem to have spoken to the programmer directly which is something I'd encourage you to try and do if possible. The root problem here seems to be not a DL but a lack of a communication path between those involved in the work which will undoubtedly lead to confusion and wasted effort. Yes, you are correct. I do not have direct communication with the programmmer(s). Client started giving me many CSS coding assignments for this site since 3 months ago, never was once she returns with a feedback that my code has problem. The markup that was replaced was the first assignment I received for the site and I did not hear anything until two days ago I found out myself. Now it does seem a bit strange to me, that if my markup is not standard practice by client's client's in-house programmers, why they would agreed to have my client kept sending me more assignments. Still haven't hear from client for the explanation. I guess I just have to move on. Oh, and I forgot to give credit to Russ. He showed me how to do 3 columns layout in DL :) http://www.maxdesign.com.au/jobs/rating/index.htm Russ, I humbly recommend you make a link for above example to this page http://www.maxdesign.com.au/presentation/definition/ It's in my bookmark and I have visited it so many times. I remember when I wanted to do the 3 column layout you showed me, I went to your definition page to look for example. Found none, so I posted the question, and was very grateful you response. Sincerely, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] programmmer said: difination list not a standard practise
On Oct 11, 2006, at 11:01 AM, Rob O'Rourke wrote: Alright Tee, Definition lists are pretty cool but is it standard practice to have multiple dds ? That might be what they were getting at. You can nest almost anything inside a dd so that might be another solution. Rob, Cool was not the intention I use definition list for that member profile. I also do not think you can nest almost everything inside a dd in this layout. http://project.lotusseedsdesign.com/test/user1.html Do you know what the scripts will be doing with the markup e.g. resizing, hiding, doing backflips etc..? I don't know. If you are interested, I can send you the site's url offlist. Can't post it on public though as I afraid I may lose my job :) tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] programmmer said: difination list not a standard practise
On Oct 11, 2006, at 12:44 PM, Patrick H. Lauke wrote: so there are probably 100s of ways to skin that particular cat (or orang utan). Patrick, please enlighten me, so that next time I can do a better job. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] -moz-border-bottom-colors. Help
Hi I have a tabbing panel with two tab that follows a table. Couldn't get the unselected tab touches the table's top border in Firefox, if I add a pixel of padding bottom, it works but then the tab overlapping the table, this is not desirable by client. I wanted to use -moz-border-bottom-colors just for this tab, it doesn't seem working with this line of code -moz-border-bottom-colors: 1px solid #000; or this -moz-border-bottom-colors: #000; According to http://developer.mozilla.org/en/docs/ Creating_a_Skin_for_Mozilla:In-Depth#-moz-border-bottom-colors -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow transparent; I must confess I do not quite understand ThreeDDarkShadow ThreeDShadow . Thanks! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] CSS technique quest for tabs
On Aug 26, 2006, at 4:14 AM, Pat Boens wrote: The only problem is that, on your page at least, there are multiple elements of your HTML code that have the same id! id=active. It would be better to use a class so that you can have multiple tabs on the same page. Pat Hi Pat, thank for the reminding. I do know only an ID can be used in single html page. It did occur to me to explain that I copied the same ID for the second example (because base on observation, I almost knew there will people who will remind this to me), but then I believe it was so obvious for anybody to see from the page I came up, and the question I asked, that my page is an example for the question I was seeking, that which one is more semantic (or semantically correct). In the page I presented two identical tabs menu with slightly different markup in li. It's hard to believe that anybody would refuse to help answer me because I have more than one ID in my example page. Regards, tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] CSS technique quest for tabs
To be honest I am a little confused by your menu hierarchy. Is Popular a heading or a sub menu element? Anyway your HTML structure was incorrect as you had a li element a direct child of another li element. Here is what I _think_ you were trying to achieve: div id=tab ul li id=activea href=#you are here/a/li li a href=#Popular/a ul li class=firsta href=#today/a/li lia href=#this week/a/li lia href=#this month/a/li /ul /li /ul /div Hi Kepler, Thanks for looking. Yeah, you are right, I have a look again, my menu is confusing, not just hierarchy, but the code also wrong in the example page. The 'popular' is a sub menu element and 'today', 'this week' and 'this month' are the sub menu of 'popular'. The job was completed on Thursday night with correct markup though, but the result isn't semantic I am afriad, as client wanted it this way because it makes sense to him: ulli id=activea href=#you are here/a/li li a href=#Popular/a | a href=#today/a | a href=#this week/a | a href=#this month/a/li /ul Thanks again for showing the correct markup. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] CSS technique quest for tabs
Hi, I am stuck with a simple layout that I don't know how to
creatively do it.
Please see the screen shot here
http://lotusseedsdesign.com/tab.png
I have something like this in my style sheet but it isn't working
when preview in Safari and Firefox.
#tab_wrap {background: olive; width: 600px; position: relative}
#tab {background: brown;width: 600px; margin-top: 50px;border-top:
1px solid #fff;}
#tab ul {list-style: none;}
#tab li {display: inline;list-style: none; background: #66;}
#tab li a {display: inline; color: #fff; padding: 5px;}
Your help is much appreciated!
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] CSS technique quest for tabs
On Aug 24, 2006, at 4:30 PM, Harvey Ramer wrote: Tee: The best resource I know if is here: http://css-discuss.incutio.com/?page=ListTabs - Harvey Hi Harvey, thanks for the tips. I will look it over and see if I can find something useful. I do know how to make tabs. The challenge I am facing now is, I have a page with white body background, where in the tab section, there are two different background colors, with a 2px white border (or gap) separate the olive and brown background colors. http://lotusseedsdesign.com/tab.png So it's more a how to creatively do it than how to make tabs in CSS :) tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] CSS technique quest for tabs
Hi Paul and TuteC, Thank you so much, I will definitely try your methods. At the meantime, I very much love to get your help again with my method which is using background image, it's getting so close yet I couldn't get the left and right padding work. Here is the page: http://lotusseedsdesign.com/tabs_wbg.html I don't want the left and right padding for second tab as you can see from the example image I came up. I already declared 0 padding in #tab li and #tab li a. http://lotusseedsdesign.com/tab.png In my html file, the second example, with a black vertical line separating the links, I guess this is more a semantic thing I am after because today, this week and this month are under the popular category. Logically I think it should be this way (first example) ulli id=activea href=#you are here/a/li li lia href=#Popular/a/li lia href=#today/a/li lia href=#this week/a/li lia href=#this month/a/li /li /ul or this (second example): ulli id=activea href=#you are here/a/li li a href=#Popular/a | a href=#today/a | a href=#this week/a | a href=#this month/a/li /ul thanks again! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] CSS technique quest for tabs
On Aug 24, 2006, at 5:54 PM, Paul Bennett wrote: Hi Tee, Code follows. A few things to work out, but I think it gets you most of the way there: Hi Paul, I see your method is working nicely and have fixed the padding problem that I have with my method. Definately yours is more creative and leaner. Thanks again! tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] xhtm 1.1 and Ruby annotations
Thanks to Eugenio, I was reading the article from sitepoint forum. XHTML 1.1 deprecates the lang attribute (in favour of xml:lang) and also the name attribute for a and map tags. It also adds a number of elements for Ruby annotations. I have a question about XHTM 1.1, Ruby annotations and validation. I do CSS coding for a company that its clients' sites are developed in Ruby. Every time I receive a job, I am curious why they used XHTML 1.1 - I asked once but it was never answered. Now this part is clear with the article I'd just read. All jobs I received, the markup are full of errors (xhtml and html all mixed up), fixing the validation errors really isn't part of my job but I try my best to clean up as much as possible (no pay because I was not asked to do it) however sometimes it's just not possible to help fixing it because almost every page uses iframe that the code is generated from server. I learned that XML is about well-formness and with XTHML, no markup error should exist or browsers give parsing errors - those sites are served with XML and XHTML 1.1, but none of the sites I visited ever broken. Why? tee ** 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] should ebay listing alike be tabular layout?
On Aug 6, 2006, at 11:28 AM, David Dixon wrote: With that particular page, and with the example you used, then I'd say yes, a tabular layout is well justified. In fact I wouldn't even recommend structuring data in that fashion using divs/spans etc, as the markup would a) be as bulky as hell, and b) provide no relationship between the headings and data, or even the data itself. Thanks David and all, yes, your feedbacks help alot. By the way, have anybody read the Designing with web standards second edition yet? I have the first edition, absolutely love it and this book got me to be passionate about web standards and CSS design. Any big changes for the second edition and something I must read? All these CSS, web design, web standards book cost big fortune, try very hard not to spend money on second, third editions :) tee ** 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] should ebay listing alike be tabular layout?
On Aug 6, 2006, at 4:10 AM, Ben Buchanan wrote: Hi I have a question, should ebay listing alike be tabular layout? Do you mean an entire item's listing, or a page listing multiple items? A URL would be handy to clarify which bit of ebay you're talking about :) Something like this: http://search.ebay.com/search/search.dll?cgiurl=http%3A%2F% 2Fcgi.ebay.com%2Fws%2Ffkr=1from=R8satitle=designing+with+web +standardscategory0= The layout I need to do is such: image | item desc | Price | Ending | Time Left | Bids | Store Didn't get a response early so I told client he shouldn't waste money for me to do the conversion, still, I would love to have second opinion perhaps for future reference. By the way, the layout of the site is CSS but few section are done in tables, that is part of the reason I think the listing shouldn't need to convert to CSS. It looks tabular to me. Best, tee ** 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] should ebay listing alike be tabular layout?
On Aug 6, 2006, at 4:20 AM, Shlomi Asaf wrote: can u please send us a link to this page? Sorry, can't do that. All jobs for this client are NDA. See my other post please. Thanks! tee ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] should ebay listing alike be tabular layout?
Hi I have a question, should ebay listing alike be tabular layout? Have a small job comes in that client asks to convert an ebay alike auction layout (which is done in table) to css. I think it's tabular justifiable and therefor do not wish client to spend unnecessary money for me to do the conversion. Thought I get a second opinion from you experts. Thanks! tee ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] International Layout in CSS
I was working on a pro bono Chinese site and is asked to layout a
certain section text vertically, read from right to left - this is
the old format which is still be used in Taiwan for books. My first
reaction is it can't be done practically, for CSS playground maybe,
but I am told I can use layout-flow: vertical-ideographic. I never
heard of this until today, so I did a search on google and paid a
visit to W3C. Holy moly! there really has layout-flow: vertical-
ideographic, so I did a simple test, but it doesn't work.
Browser tested: Safari and Firefox.
What did I missing?
I simply add an id
#vert {layout-flow:vertical-ideographic; float: right; width: 200px;
height: 300px}
According to this page:
http://www.w3.org/TR/1999/WD-i18n-format-19990127/
Is it still a working draft that no browser will support?
Thanks!
tee
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] text-shadow
Hi,
I was browsing a site from Safari browser, when hover over
navigation, it gives me a nice text-shadow effect. This is the first
time I see such effect so I had a look on its CSS and the code shows:
#nav li a:hover {
* color : #fff;
* text-shadow : #050 2px 2px;
I tried checking out the same site from Firefox, Opera, Camino and
IEs. It appears that Safari is the only browser that supports the
text-shadow. A quick visit to W3C site shows that it belongs to CSS 3.
Does it meant we are close to using CSS3 soon?
Boy! I haven't fully understand CSS 2.1 yet.
Cheers,
tee
**
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] w3c inspecting icon factory
On Jul 29, 2006, at 1:06 AM, Christian Montoya wrote: That just means that QT, WMP, and RM are all bad. What do Google Video and Youtube use? Flash/FLV. I would recommend FLV over any of the previous 3. I always think hamburger is the most evil food mankind ever invented, still we have more hamburger eaters than anything else, but I am not going to do missionary work to convert burger eaters to something else just because I think it's bad. What I think is bad matter nothing to others, it doesn't even matter to me. Like my friend say, what! it's just a food that feeds my stomach when I am hungry. Same to the above software, they are just tools, one maybe better than the other, but to say they are all bad is very black and white statement. One ought to be able to see the uselessness of its usefulness, hence to be able to see 'gray' and thus, reach a level of enlightenment - it's good for your soul and it's good for your work :) tee ** 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] w3c inspecting icon factory
Hamburgers don't crash my browser. -- It depends on the format you feed them into the computer - binary OK but organic might cause a few problems for the computer :lol: :lol: and watch out for mad cow virus. Rumor has it that it has spread to internet land. :lol: tee ** 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] w3c inspecting icon factory
On Jul 28, 2006, at 7:43 AM, Patrick Haney wrote: To be honest, I'm not sure why they didn't go with animated GIFs to do this. I'm sure the file size would've been larger, but no plugins are necessary and I've seen plenty of pixel art animations done with GIF. Can animated GIFs achieves this level of animation? QT at least is better than WMP or RM format, and it's more accessible for PC users to download than having Mac user download Window Media Player (which Microsoft no longer support Mac platform) and Real Player. tee ** 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] IE7 news
On Jul 28, 2006, at 7:39 PM, Al Sparber wrote: From: Roberto Gorjão [EMAIL PROTECTED] Right now, I work with XP SP2 (home edition, sigh!) and IE6. I have IE3, IE4, IE5 and IE5.5, all as standalone versions. The standalone hack should only be used as a last resort by web designers who cannot afford the luxury of dedicated testing machines or a VPC setup. If one does do the hack they need to make sure to also hack the registry to ensure proper version identification. There have been cases reported of OS corruptions after repeated installs and uninstalls. While a lot of people use the standalone hack, it should be stated that it is a hack and does have potential problems. Al, I installed twice the IE 7 beta 2 3 on my Mactel powerbook, Parallels Workstation XP SP2, for two very specific projects that client wanted IE 7 safe proof, after that I uninstalled. Few weeks ago, someone mentioned a more stable IE 7 standalone, so I installed, but it was full of probem, many functions don't work, the very obvious one was it didn't allow me to run the validation check on contentquality site. My tiger OS recently is having some system errors however I can't even tell if they were caused by IE 7 repeated uninstallation, because the XP is running in the Pareallels software. I only use the XP for browser testing, and when I run the system in Parallels, I don't get any errors. tee ** 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] Displaying page in different resolutions
On Jul 26, 2006, at 7:57 AM, pdr Lists wrote: Hi Chris The stats package we use on our website allows us to monitor: - Screen resolution - Actual browser window size - Browser - Operating system Hi Chris, you may like to try to apply for google analytics code too. http://www.google.com/analytics/ Google analytics gives very detailed stats, it produces report for Executive, marketer and web master. It has a section for web design parameters where you can see very detail reports for 1) browser versions 2) platform versions 3) Browser Platform Combos 4) Screen resolutions 5) Screen colors 6) Languages 7) Java Enabled 8) Flash version 9) Connection Speed 10) Hostnames When I first applied, it took some 3 weeks to get the code, after that it gave away invitation codes like crazy - one google account per analytic code, kind of like gmail thing :). So far I received 6 codes and installed them to 6 websites. It doesn't allow user to send invitation though, otherwise I will be sending many away. About the screen resolutions, if google analytics reports are correct, I think we can safely design for 1024 x 768 freely and use big images :) . Of 6 websites I installed the analytics, there are only 3 to 9 percent of users who use 800 x 600 resolutions and the dial-up user is less than 6%. 1024 x 768 resolutions dominated 65% and above. Cheers, tee ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] quirks mode and font size inheritance
Hi, regarding my previous message, are transitional doctypes quirks
mode - lo and behold! I finally got it collect, I would like to get
enlightenment from you knowledgeable ones about quirks mode and font
size inheritance.
The quest came from a discussion from a CSS study group. Someone
posted a question why the font size in particular section (link
list) in her page appears much smaller than 12px.
In her CSS, she declared:
body {font-size: 12px}
a {font-size: 12px}
I answered it was because font-size is inherited and that a element
inherited the 12 pixel font size from body, and suggested
body {font-size: 100.1% }
be used, I also suggested to change the pixel unit to em.
Someone else replied that the font size in link list appear smaller
was because the page has no doctype, hence through browsers throw the
page to quirks mode.
I disagreed - declaring doctype is important however on this
particular case, it's the inheritance of font-size that causes the
problem. Along the way, I said transitional doctype also throw the
page to quirks mode - and I truly believed what I said when I said it.
I came up with examples to prove my point.
http://lotusseedsdesign.com/sapotek/group-px.gif
and their respective pages:
http://lotusseedsdesign.com/sapotek/xhtml-strict-dtd-px.html
http://lotusseedsdesign.com/sapotek/xhtml-tran-dtd-px.html
http://lotusseedsdesign.com/sapotek/html-strict-dtd-px.html
http://lotusseedsdesign.com/sapotek/html-trans-dtd-px.html
http://lotusseedsdesign.com/sapotek/nodtd-px.html
In the original page, font-size only declared in a and body elements.
In my five examples, the nodtd-px page, the headings and p tag
content, the font size appears bigger than those that have doctype
declared.
Hence I wrote:
As you can see clearly, the a tag linklist makes no different whether
it has doctype declared or not, and it makes no different with strict
or transitional (quirks mode) doctype or not, be it html or xhtml.
With pages that have doctype declared, the font size was not declared
in all headings and p, therefore they inherited from the body 12px
font-size. The one with no doctype declared, the headings and p font
size appears bigger, this I believe is that browser default takes
precedence when it doesn't need to listen to doctype (or rather, no
doctype tells her what to do). Why it does so? I have no knowledge to
explain it, but my assumption is such:
It takes 'two' in order for inheritance to work, and with criteria -
that is why you see the link list' font size appear the same in
different doctype because it's being declared to 12px in css, and it
inherited from the 12px font size from the body that is also declared
in css.
So, it seems the way it works is such:
When there are two elements declared font size in CSS and the two
elements have inheritance relationship, even without doctype, browser
smartly followed - and this maybe the criteria (or condition) browser
has.
So when criteria is not meet, without doctype, browser doesn't follow
and doesn' take the parent font size into account.
However, it seems that when there is doctype declared, criteria
partially meets, it takes parent font size as higher specificity , and
make the headings and p inherit to their parent font size, which is
the body.
Now I get confused, have little faith to what I thought was correct,
and here I am, seeking for the correct answer from you who have more
knowledge and experience in this area.
p/s. I know my English is difficult to understand. Please read it
once, read it twice, read it thrice and read it few more time until
you understand what I am trying to say :)
tee
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] are transitional doctypes quickmode
Hi, Please tolerate my ignorance. I always thought transitional doctypes are quirkmode but today I was told it's not, the quirkmode is when a page has no doctype declared. tee ** 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] Tool for making screen shots from MSIE 7.0 Beta exists
On Jul 14, 2006, at 10:14 AM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:Can anyone tell me if a tool for making screen shots from MSIE 7.0 Beta exists?I googled and found this, which lead me here. But it does not show a option for the IE 7 Beta screen shots.I don't want to download IE 7.thank you once againHi Sharron, Browsercam has MSIE 7.0 beta available, but you need a to be a member though. I subscribed to Browsercam pool that cost $20 a month, that price was before Browsercam jacked up the price. Happened to install IE 7 Beta 3 last night as client wanted me to give a screen shot of this browser. I probably will uninstall it once the project finishes. At the meantime, if you need a screen shot from IE7, let me know, I can make one for you.tee **The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help**
[WSG] server speed and webhost
This is somewhat off-topic and I ask for your forgiveness - please don't shout and don't write back to the list telling me my message is not appropirate as it will create unnecessary (extra) noise to others, on top of the noise I already made :) The reason I post the message here is because this is the only place I know that has many international members and some are from Asia. I am helping a new client from South East Asia to move his web server to a new host. He said there were number of email from visitors that the website loads very slow and asked me to find one in the North America. Client has DSL broadband and he thinks his website loads slow. My browsing experience on certain countries' websites lead to a same conclusion that everything is slow. While I understand there are many factors contributing to slow loading, I would like to know if web server speed is one of the many for I think it's best for client to host his web server within his country if the web server from which country isn't the main concern for speed. Please write me off-list Thank you! tee ** 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] content: .;
It's the CSS 'content' property, explained here: http://www.w3.org/TR/CSS21/generate.html#content And this explains what is this for? part: http://positioniseverything.net/easyclearing.html Thank you Paul and Rimantas :) tee ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] IE 7 beta 2 and IE6 Standalone
Greetings, Anybody installed IE7 beta 2 and IE6 Standalone? I am having problem runing IE6 standalone, for instance, on every page I click, it gives me error message; Some menu functions such as File Page Setup, Print, Print Preview, Properties are not working; under the Help menu, except about internet explorer, the rest give me error message with send report option. In the about internet explorer, the logo of IE 6 stays intact but the rest of the info obviously belong to IE7. The IE 6 standalone from evolt.org is for SP1, my XP is SP2, so I am supecting they are not compatible. Problem is, I am running the XP from Parallels Workstation in Intel Mac, and because PW is still a beta version, therefor I don't know if it's causing problem or not. thanks! tee ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
