[WSG] IE fixed: PNG transparency working like Firefox???
Hi, A developer on my project showed me a site with a lot of PGNs using alpha transparency. Formely we had to include a piece of javascript to get it working the way we want in IE 6.x Since the last patchday it seems that IE 6.x got a security update that fixed the alpha transparency issues as well. Is there some one who can verify our findings? Regards, JW http://pomtiedom.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] Better Flexible Rounded Corners Option? and Site Check
Hi Roger
Thanks for the links.
I tested the one with fix width and will be testing the flexible one later.
The demo is the 2nd one at http://design.sodesires.com/tictap/
It shows fine in Firefox, Opera 7 and IE6 but it breaks in IE5. Any
solutions?
I added an extra div (.cornersFix-border ) in the html as I do not have any
paragraph. Hmm maybe someone can come up with a better solution.
CSS:
.cornersFix
{
width :660px;
padding :0em 0 10px 0em;
margin :10px auto;
background :#FF url(../../../images/global/corners/main-B.gif)
no-repeat left bottom;
}
.cornersFix ul
{
margin :0;
padding :15px 10px 0px;
background :url(../../../images/global/corners/main-T.gif) no-repeat
left top;
}
.cornersFix-border
{
margin :0;
padding :0em 10px 0px;
border-top : 0 solid #DBD7BD;
border-right : 3px solid #DBD7BD;
border-bottom : 0 solid #DBD7BD;
border-left : 3px solid #DBD7BD;
}
HTML:
div class=cornersFix
ul id=steps
li id=step-one title=TicTap Step 1strongStep 1:/strong Key in the
ISBN, UPC, or Keywords to describe the product./li
li id=step-two title=TicTap Step 2strongStep 2:/strong Send the
message to xxx-xxx-./li
li id=step-three title=TicTap Step 3strongStep 3:/strong Receive
your query by SMS. You can also view previous results at TicTap.com./li
/ul
div class=cornersFix-bordernbsp;/div
/div
With Regards - Jaime
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Roger Johansson
Sent: Thursday, 9 September 2004 2:50 PM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Better Flexible Rounded Corners Option? and Site Check
On 8 sep 2004, at 22.57, JW wrote:
I am looking for a flexible rounded corners (with borders) that is not
restrictive to size. Googled for some but most are filled with lots of
complex solutions (lots of html meddling and tones of css codes).
Hi.
Take a look at what I came up with a while back:
http://www.456bereastreet.com/lab/flexible_custom_corners_borders/
Related post:
http://www.456bereastreet.com/archive/200406/
flexible_box_with_custom_corners_and_borders/
http://www.456bereastreet.com/lab/teaser/one_image/
Related post:
http://www.456bereastreet.com/archive/200406/css_teaser_box/
/Roger
--
http://www.456bereastreet.com/
**
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] Better Flexible Rounded Corners Option? and Site Check
Hi
I am looking for a flexible rounded corners (with borders) that is not
restrictive to size. Googled for some but most are filled with lots of
complex solutions (lots of html meddling and tones of css codes).
Did anyone come across something good?
Right now this page - http://design.sodesires.com/tictap/ - I am working on
is using a fix width image (top bit and bottom bit image using css for side
borders). Not the best solution as my width is fixed...Just temporary markup
for me to look at the site.
In IE, if you hover over menu, the side borders will disappear. It looks ok
upon loading or refresh of page. I have no idea why this is happening.
Perhaps someone knows?
I have checked the site in Win-IE5-6, Firefox and Opera 7. Can any Mac users
kindly help me to check it in IE 5?
CSS Markup for Rounded Corners:
#corners-mainT, #corners-mainB {float: left; width: 660px;}
#corners-mainT {background: #FF
url(../../../images/global/corners/main-T.gif) no-repeat left top;}
#corners-mainB {background: url(../../../images/global/corners/main-B.gif)
no-repeat left bottom;}
#corners-main
{
border-right: 3px solid #DBD7BD;
border-left: 3px solid #DBD7BD;
margin: 15px 0px;
padding: 5px 0px 0px;
}
CSS Markup for Rounded Corners' Content (if it helps to give a better
overview):
#step-one, #step-two, #step-three {width: 173px; padding-top: 180px;
padding-left: 15px;}
#step-one {background: url(../../../images/home/step-1.gif) no-repeat;}
#step-two {background: url(../../../images/home/step-2.gif) no-repeat;}
#step-three {background: url(../../../images/home/step-3.gif) no-repeat;}
#steps li {font-size: 0.9em; color: #5F4A3F; float: left;margin-left: 25px;}
* html #steps li {margin-left: 22px; ma\rgin-left: 17px;} /* IE6-win has
larger padding than IE5-win */
HTML Markups:
div id=corners-mainTdiv id=corners-mainBdiv id=corners-main
ul id=steps
li id=step-onecontent here/li
li id=step-twocontent here/li
li id=step-threecontent here/li
/ul
div class=divClearnbsp;/div
/div/div/div
With Regards - Jaime
**
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
RE: [WSG] Horizontal List in Mac IE
Thanks James.
I guess you are having the problem where IE Mac doesn't float your list
elements properly and they all go to 100% width down the page?
That was the bug I was having and now it is fix thanks to you :)
With Regards - Jaime
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of James Ellis
Sent: Friday, 6 August 2004 7:27 AM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Horizontal List in Mac IE
Jaime
I guess you are having the problem where IE Mac doesn't float your list
elements properly and they all go to 100% width down the page?
I did this to solve the problem.. you need to float the anchor to the
left as well.. it's the only hack I use:
#menu ul li
{
float : left;
display : block;
/* other rules here */
}
#menu a
{
/* for IE 5 mac - float the block level element */
float : left;
display : block;
/* other rules here */
}
/* IE 5.0 for Mac Hack
stops a float for all browsers except IE5 for Mac \*/
#menu a {float:none;}
/* end IE 5.0 for Mac Hack */
You can see it in action at my.spamtrap.net.au
Regarding display : inline; to do things like this.. I know you aren't
using it but it shouldn't really be used as it will break up individual
navigation elements over lines (that's what inline elements do) - better
to make everything a block then consistency remains.
Cheers
James
JW wrote:
Hi Everyone
I am having problem with horizontal list in when viewed in Mac IE.
http://design.sodesires.com/inspiration/
Anyone can tell me why it is not showing as inline? Any solutions?
CSS as follow:
#menu
{
font-family : Verdana, Helvetica, Arial, sans-serif, Geneva;
color : #1C2819;
font-size : 11px;
background : url(../../../images/global/page/header-bottom.jpg)
no-repeat;
height : 56px;
padding-left: 5px;
}
#menu a
{
display : block;
color : #1C2819;
text-decoration : none;
font-weight : bold;
padding : 0 0.6em;
}
#menu ul {height: 24px; margin: 0; padding: 0;}
#menu li {padding: 0; float: left;}
#menu li a:hover, #menu li a#menu-selected
{
color : #ABB698;
background : #1C2819;
}
With Regards - Jaime
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
**
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] Horizontal List problem in IE
Hi
I am having problem with my horizontal list IE as 'Child A-D li' is showing
at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7. They are
all floated to the left in a straight line.
ul
liDaddy raquo;/li
ul
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
/ul
CSS as follow:
#menuSub
{
font-family : Verdana, Helvetica, Arial,
sans-serif, Geneva;
color : #D6D7C8;
font-size : 12px;
font-weight : bold;
clear : both;
padding : 12px 10px 0px 7px;
}
#menuSub ul {display: inline; margin: 0; padding: 0;}
#menuSub li {padding-right: 10px; float: left;}
#menuSub li a {color: #A5A682; text-decoration: none;}
#menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;}
The final effect should show as:
Daddy Child A | Child B | Child C | Child D
And not:
Daddy
Child A | Child B | Child C | Child D
Best Wishes,
Jaime ...
*
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] Horizontal List problem in IE
Here is the demo link:
http://design.sodesires.com/kimberley/collections/set/index.html
IE 5-6 PC is not showing it the way I want :P
why not do this and avoid the nested list
If I do not use nested list, the document structure would be like:
* Daddy
* Child A
* Child B
* Child C
* Child D
With nested list:
* Daddy
- Child A
- Child B
- Child C
- Child D
Think with nested list, it makes more sense?
Best Wishes,
Jaime ...
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Nick Gleitzman
Sent: Tuesday, 29 June 2004 8:24 PM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Horizontal List problem in IE
Hard to tell exactly without seeing full context (a link is better than
a code extract), but why not do this and avoid the nested list:
ul
liDaddy raquo;/li
li/li
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
Nick
___
Omnivision. Websight.
http://www.omnivision.com.au/
On Tuesday, June 29, 2004, at 10:12 PM, JW wrote:
Hi
I am having problem with my horizontal list IE as 'Child A-D li' is
showing
at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7.
They are
all floated to the left in a straight line.
ul
liDaddy raquo;/li
ul
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
/ul
CSS as follow:
#menuSub
{
font-family : Verdana, Helvetica, Arial,
sans-serif, Geneva;
color : #D6D7C8;
font-size : 12px;
font-weight : bold;
clear : both;
padding : 12px 10px 0px 7px;
}
#menuSub ul {display: inline; margin: 0; padding: 0;}
#menuSub li {padding-right: 10px; float: left;}
#menuSub li a {color: #A5A682;text-decoration: none;}
#menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;}
The final effect should show as:
Daddy Child A | Child B | Child C | Child D
And not:
Daddy
Child A | Child B | Child C | Child D
Best Wishes,
Jaime ...
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
RE: [WSG] Horizontal List problem in IE
Thanks I'll look into it. Best Wishes, Jaime ... -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Ben Bishop Sent: Tuesday, 29 June 2004 10:23 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] Horizontal List problem in IE Hi Jaime, To correctly nest one list within another, open the new list before closing it's parent li example: ul liParent ul liChild/li /ul /li /ul You might look through the list archives for James Ellis' posts detailing display differences between browsers due to whitespace between list elements. And finally, consider replacing the parent raquo and the child pipes with equivilent background images to clean up your mark-up. I'm sure this has been already discussed a few times, so help in this department should be in the archives. -ben HTML 4.01 http://www.w3.org/TR/html401/struct/lists.html#idx-list-3 * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help * * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
[WSG] Unclickable link in Opera 7
Opera 7 refuses to make one particular link clickable:
http://design.sodesires.com/kimberley/about/products/index.html
The navigation Finishing is not clickable in
Opera 7:
Timber Species | Fittings | Finishing
I guess that maybe the logo span is the culprit:
#logo
{
width :
130px;
height :
61px;
position :
relative;
float :
right;
}
#logo span
{
background :
url(../../../images/global/page/logo.gif) no-repeat;
position :
absolute;
width :
100%;
height :
100%;
}
Anyone knows a solution to this? I am aware that the logo
background image is not visible in IE Mac. Have yet to find a solution for it.
Best Wishes,
Jaime ...
RE: [WSG] Unclickable link in Opera 7
I fixed the problem :) I hope
For some reason, a float: right in Opera
makes it think that the height is truly 100% so it covers the link and make it
non-clickable.
I fixed it by changing float right to
margin left:
#logo {width: 130px; height: 61px; position:
relative; margin-left: 470px;}
Looks ok to me on a PC IE 5+, Firefox and
Opera 7
Do let me know if it is not working in
your browser. Thanks!
Best Wishes,
Jaime ...
From:
[EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of JW
Sent: Tuesday, 29 June 2004 11:10
PM
To: [EMAIL PROTECTED]
Subject: [WSG] Unclickable link in
Opera 7
Opera 7 refuses to make one particular link clickable:
http://design.sodesires.com/kimberley/about/products/index.html
The navigation Finishing is not clickable in
Opera 7:
Timber Species | Fittings | Finishing
I guess that maybe the logo span is the culprit:
#logo
{
width
: 130px;
height
: 61px;
position
: relative;
float
: right;
}
#logo span
{
background
: url(../../../images/global/page/logo.gif) no-repeat;
position
: absolute;
width
: 100%;
height
: 100%;
}
Anyone knows a solution to this? I am aware that the logo
background image is not visible in IE Mac. Have yet to find a solution for it.
Best Wishes,
Jaime ...
Re: [WSG] Mac IE Fix Sites
opps ok here is the page that shows funny in Mac IE. http://www.sodesires.com andeverything thereafter. The CSS for layout is athttp://www.sodesires.com/scripts/css/style_glass/glassLayout.css Thanks for the links Hugh. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 28/02/2004 2:31:38 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] Mac IE Fix Sites Hello, Jaime, Your original post did not allow us to look at the HTML. Screen dumps are not hugely useful. I believe the best way to request help on this list is to post links to both the HTML and the CSS so that people can look at them. Could you do this? It looks as though the issue in the main part of your page has to do with clearing. IE5 Mac has a bug which makes floated items inside cleared items inherit the clear, even if you set the inside floated item to "clear:none". So you have to find a way to build your CSS that avoids this issue. http://www.macedition.com/cb/ie5macbugs/#floatclearbug -Hugh Todd And here's another reference resource: http://www.l-c-n.com/IE5tests/ * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
[WSG] Mac IE Fix Sites
Hiif there aren't any suggestions then could anyone point me to agood site that addresses most MAC IE bugs and fixes? Most sites deal with PC and I couldn't find much about Mac IE so have no idea how to fix the madness. Thanks. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ IncrediMail - Email has finally evolved - Click Here
Re: [WSG] Mac IE Fix Sites
Thanks Daniel I'll check it out. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 28/02/2004 1:22:40 AM To: [EMAIL PROTECTED] Subject: Re: [WSG] Mac IE Fix Sites Hi if there aren't any suggestions then could anyone point me to a good site that addresses most MAC IE bugs and fixes? Most sites deal with PC and I couldn't find much about Mac IE so have no idea how to fix the madness. Hello Jaime. Try: http://www.macedition.com/cb/ie5macbugs/ http://macedition.com/cb/resources/abridgedcsssupport.html -- daniel torres burriel/zaragoza/spain/ web: www.torresburriel.comkey: 0x43DB2AB7 msn: [EMAIL PROTECTED]icq: 13764500 jabber: [EMAIL PROTECTED] I'm against Spanish PHN --- asociacin de internautas www.internautas.org IncrediMail - Email has finally evolved - Click Here
[WSG] MAC IE FIX?
Hi all..here to seek for help again.
I have managed to get a friend to help me test my site on his MAC and what I see is a shock...(should have expected that).
Here is some screenshots on what it looks like in MAC IE http://www.sodesires.com/pdf/sod_macie.pdf
These are my layout for the site for 2 and 3 columns. Sorry for the length..it is rather long.
Any tips or solutions? Critics are welcome too so I can improve or kick any bad habits if any.
Are there any hacks that should be there which I did not have?
/* OVERALL~~ */#wrapper1 {background-color: #E2DEC4;background-image: url(../../../images/global/bg/bg_tiler.gif);background-repeat: repeat;}#wrapper2{background-image: url(../../../images/global/bg/bg_bottom_tiler.gif);background-repeat: repeat-x;background-position: left bottom;}
#globalContainer{width: 678px;background-image: url(../../../images/global/bg/style_glass/contents_tiler.gif);background-repeat: repeat-y;margin-left: 35px;}
/* HEADER~~ */#headerContainer, #headerContainer2,#headerContainer3, #header {background-image: url(../../../images/global/bg/style_glass/header_tiler.gif);background-repeat: repeat-x;background-position: left top;height: 151px;width: 678px;}
#headerContainer2,#headerContainer3,#header,#menuContainer{background-repeat: no-repeat;}
#headerContainer2{background-image: url(../../../images/global/bg/style_glass/header_bg_left.gif);}
#headerContainer3 {background-image: url(../../../images/global/bg/style_glass/header_bg_right.gif);background-position: right top;}
#header {background-image: url(../../../images/global/bg/header_logo_bg.gif);background-position: 14px 41px;}
#headerTitle{height: 80px;width: 235px;padding-top: 41px;padding-left: 423px;}
#menuContainer{background-image: url(../../../images/global/bg/menu_bg.gif);background-position: 156px 10px;height: 40px;margin-top: 7px;}
#style{float: left;margin-left: 25px;margin-top: 12px;display: inline;}
#menu{margin-left: 323px;}
/* CONTENTS + FOOTER CONTAINERS~~ */#twoColContainer,#threeColContainer{text-align: justify;margin-top: 40px;width: 678px;background-repeat: repeat-y;background-image: url(../../../images/global/bg/2columns_tiler.gif);}
#threeColContainer{background-image: url(../../../images/global/bg/3columns_tiler.gif);}
/* CONTENTS~~ */#leftPadding p{margin: 0px;padding: 0px;}
/* Make sure that .leftcolumn's width is equal to .centercolumn's margin-left */#leftColumn{float: left;width: 180px;}
/* Make sure that .rightcolumn's width is equal to .centercolumn's margin-right */#rightColumn{position: static;float: right;width: 258px;}
/* Width = 240 */#centerColumn {margin-right: 258px;margin-left: 180px;}
/* 2 Columns layout */#mainColumn {margin-left: 180px;}
#leftPadding,#centerPadding,#mainPadding,#rightPadding {padding-bottom: 5px;}
#leftPadding {text-align: left;color: #A49B8B;padding-right: 5px;padding-left: 25px;}
#centerPadding {padding-right: 5px;padding-left: 22px;}
#mainPadding {padding-right: 30px;padding-left: 25px;}
#rightPadding {padding-right: 30px;padding-left: 18px;}
/* FOOTER~~ */
/* BG tiler */#footerContainer {background-image: url(../../../images/global/bg/style_glass/footer_tiler.gif);background-repeat: repeat-x;background-position: left top;background-color: #BBB8A2;width: 678px;height: 89px;clear: both;}
/* BG Left and BG Right */#footerContainer2, #footerContainer3 {background-color: transparent;background-image: url(../../../images/global/bg/style_glass/footer_left.gif);background-repeat: no-repeat;background-position: left top;width: 678px;height: 89px;}
#footerContainer3{background-image: url(../../../images/global/bg/style_glass/footer_right.gif);background-position: right top;}
#footer{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 9px;font-weight: bold;color: #D1CFAF;text-align: center;padding-top: 56px;}
#footer a{color: #E8EAD5;text-decoration: none;}
#footer a:hover{border-bottom: 2px solid #E8EAD5;}
With Regards,
Jaime Wong
~~~
SODesires Design Team
http://www.sodesires.com
~~~
IncrediMail - Email has finally evolved - Click Here
Re: [WSG] DTDS and which to use?
Hi all I have copied a page from my website and make the DTD XHTML 1.0 Strict just to see the diff btwn transitional and strict. You can see it here http://www.sodesires.com/about/strict.html Well thexhtml validation shows error but even after reading the explanation of errors, I still could not really understand what they meant! Below are the results of attempting to parse this document with an SGML parser. Line 11, column 17: there is no attribute "language" (explain...). script language="_javascript_" src="" type="text/javasc ^ Line 38, column 85: there is no attribute "name" (explain...). .../header_title/about.gif" alt="" name="headertitle_default" width="235" height ^ Line 38, column 138: there is no attribute "border" (explain...). ...ault" width="235" height="80" border="0" id="headertitle_default" //div ^ Line 70, column 68: there is no attribute "target" (explain...). ...t.com/gallery/so_desires.php" target="_blank" class="aLeftCol"CSS Vault/a ^ Line 74, column 125: there is no attribute "hspace" (explain...). ... pixel" width="7" height="23" hspace="10" /:: /spanspan class="ttLeftCol" ^ With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 25/02/2004 2:30:59 AM To: [EMAIL PROTECTED] Subject: Re: [WSG] DTDS and which to use? Hi Jaime, you may also find this article of some use. Addy: http://leavesrustle.com/articles/124/ Good luck. Regards, JG I have always work with XHTML 1.0 Transitional and never really bothered with Strict until I yesterday when someone sub a project to me saying that the client wanted the page done using Strict because it is the latest. Is being the latest the point in using strict? I find it kinda amusing. What's the difference actually between the 3 besides how the web generates the page and how do you decide which to use? Pondered over this because I have never tried working with strict and now that I have, W3C xhtml validator is showing bunch of errors which I have no idea why it could be errors. Basically limiting me to the core. Urggh! Why would a person decide when to use Strict? Wouldn't using transitional be easier for making it work with certain database, scripts etc like for e.g. movable type? Anyone has a link to an online tutorial with working with strict xhtml dtds besides those links at W3C? Sorry for this non CSS related topic but just hope the list could help clear my confusion :) With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ * The discussion list for http://webstandardsgroup.org/ * _ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
Re: [WSG] DTDS and which to use?
Ooo I see! Thanks Andy/ Martin! Hmm any ideas in tweaking Dreamweaver to work with standards? As for open target in new window, if I want a new window, how can I achieve it with strict? I guessis preferences really although I do notice lots of website do not open up in new window but I will always open those links up in new windows as I prefer to have the original page there to refer back to. So to open links upin new windows or not isstill a question to mecause I prefer new window. But I will try to please the majority :) With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 25/02/2004 5:53:53 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] DTDS and which to use? On 25 Feb 2004, at 09:12, JW wrote: Hi all I have copied a page from my website and make the DTD XHTML 1.0 Strict just to see the diff btwn transitional and strict. You can see it here http://www.sodesires.com/about/strict.html Well thexhtml validation shows error but even after reading the explanation of errors, I still could not really understand what they meant! No Worries. They are all pretty simple, and pretty minor. Below are the results of attempting to parse this document with an SGML parser. 1. Line 11, column 17: there is no attribute "language" (explain...). script language="_javascript_" src="" type="text/javasc There is no language attribute in XHTML strict, so you should remove the language="_javascript_" bit ^ 2. Line 38, column 85: there is no attribute "name" (explain...). .../header_title/about.gif" alt="" name="headertitle_default" width="235" height Again, there is no name attribute, use id instead ^ 3. Line 38, column 138: there is no attribute "border" (explain...). ...ault" width="235" height="80" border="0" id="headertitle_default" //div Get rid of border="0" and set this in your css ^ 4. Line 70, column 68: there is no attribute "target" (explain...). ...t.com/gallery/so_desires.php" target="_blank" class="aLeftCol"CSS Vault/a No target attribute. Get rid of this (opening up new windows is annoying anyway) ^ 5. Line 74, column 125: there is no attribute "hspace" (explain...). ... pixel" width="7" height="23" hspace="10" /:: /spanspan class="ttLeftCol" no hspace attribute. With XHTML strict you should really be aiming to move all presentational html into your css, so trash this as well. Andy Budd http://www.message.uk.com/ * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
Re: [WSG] DTDS and which to use?
UsingMX 04. Actually really want to tweak it the way it generates the html codes. Like if I am working with strict thenI cantweakit to generate the html the way I want forxhtml strict. Hmm maybe dreamweaver can't becustomised that way. Sounds rather far-fetch. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 25/02/2004 7:22:53 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] DTDS and which to use? On 25 Feb 2004, at 10:40, JW wrote: Ooo I see! Thanks Andy/ Martin! Hmm any ideas in tweaking Dreamweaver to work with standards? Which version? I stopped using it at MX. You can tick 'Make all document XHTML compliant' somewhere in preferences. As for open target in new window, if I want a new window, how can I achieve it with strict? There was the exact same discussion a few weeks ago on this board. _javascript_ was the main option (didn't pay much attention though). Do a search in the list for XHTML(OT??) on 7 Feb. I guessis preferences really although I do notice lots of website do not open up in new window but I will always open those links up in new windows as I prefer to have the original page there to refer back to. So to open links upin new windows or not isstill a question to mecause I prefer new window. But I will try to please the majority :) With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 25/02/2004 5:53:53 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] DTDS and which to use? On 25 Feb 2004, at 09:12, JW wrote: Hi all I have copied a page from my website and make the DTD XHTML 1.0 Strict just to see the diff btwn transitional and strict. You can see it here http://www.sodesires.com/about/strict.html Well thexhtml validation shows error but even after reading the explanation of errors, I still could not really understand what they meant! No Worries. They are all pretty simple, and pretty minor. Below are the results of attempting to parse this document with an SGML parser. 1. Line 11, column 17: there is no attribute "language" (explain...). script language="_javascript_" src="" type="text/javasc There is no language attribute in XHTML strict, so you should remove the language="_javascript_" bit ^ 2. Line 38, column 85: there is no attribute "name" (explain...). .../header_title/about.gif" alt="" name="headertitle_default" width="235" height Again, there is no name attribute, use id instead ^ 3. Line 38, column 138: there is no attribute "border" (explain...). ...ault" width="235" height="80" border="0" id="headertitle_default" //div Get rid of border="0" and set this in your css ^ 4. Line 70, column 68: there is no attribute "target" (explain...). ...t.com/gallery/so_desires.php" target="_blank" class="aLeftCol"CSS Vault/a No target attribute. Get rid of this (opening up new windows is annoying anyway) ^ 5. Line 74, column 125: there is no attribute "hspace" (explain...). ... pixel" width="7" height="23" hspace="10" /:: /spanspan class="ttLeftCol" no hspace attribute. With XHTML strict you should really be aiming to move all presentational html into your css, so trash this as well. Andy Budd http://www.message.uk.com/ * The discussion list for http://webstandardsgroup.org/ * . image.tiff IncrediMail - Email has finally evolved - Click Here Kind regards Martin Chapman -- Web development, identity and design. co-ord.com Limited 9 Tynwald Road West Kirby Merseyside CH48 4DA Tel: +44 (0)151 625 1443 Email: [EMAIL PROTECTED] http://www.co-ord.com -- * The discussion list for http://webstandardsgroup.org/ * IncrediMail - Email has finally evolved - Click Here
RE: [WSG] DTDS and which to use?
Thank you very much Manuel.Now everything validates and converted all pages on my site except for thefavourite linksas I have the links to open up in new pages. Now I am confident to convert client's site to XHTML 1.0 Strict. Couldn't do this with everyone's kind assistance! Once again thanks all!!! With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 25/02/2004 11:51:33 PM To: [EMAIL PROTECTED] Subject: RE: [WSG] DTDS and which to use? El mié, 25-02-2004 a las 15:02, JW escribió: Line 89, column 11: there is no attribute "name" (explain...). form name="service" id="service" method="post" action=""> form_service/dodosmail.p Yes, in Strict there's no "name" attribute for the form element, use "id" instead. Note that "name" *IS NOT* deprecated for form elements such as input, just for the form element itself (this is a common misunderstanding) ^ Line 91, column 88: document type does not allow element "input" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", address", "fieldset", "ins", "del" start-tag ...subject,name,email,country,message" / ^ Enclose the inputs within a block element such as p or div / Example: http://www.simplebits.com/bits/simplequiz/#entry579 Is that all? Congrats, then :) -- Manuel González Noriega Simplelógica, construcción web URL: http://simplelogica.net EMAIL: [EMAIL PROTECTED] TELEFONO: (+34) 985 22 12 65 Logicola es el weblog de Simplelógica http://simplelogica.net/logicola/ /pThat's right. We said Frontpage./p * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
Re: [WSG] DTDS and which to use?
Hi Gean Thanks! Now I know what strict is for ;) I really should try to build a test site during free timeon strict and make sure it VALIDATES! The requirements sure looks funny to me...allthose errorswhen validated. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 02/24/04 23:11:40 To: [EMAIL PROTECTED] Subject: Re: [WSG] DTDS and which to use? Hi Jaime, the W3Schools is a useful page. You can learn more about the diferences using this link: http://www.w3schools.com/xhtml/xhtml_dtd.asp Regards, Gean I have always work with XHTML 1.0 Transitional and never really bothered with Strict until I yesterday when someone sub a project to me saying that the client wanted the page done using Strict because it is the latest. Is being the latest the point in using strict? I find it kinda amusing. What's the difference actually between the 3 besides how the web generates the page and how do you decide which to use? Pondered over this because I have never tried working with strict and now that I have, W3C xhtml validator is showing bunch of errors which I have no idea why it could be errors. Basically limiting me to the core. Urggh! Why would a person decide when to use Strict? Wouldn't using transitional be easier for making it work with certain database, scripts etc like for e.g. movable type? Anyone has a link to an online tutorial with working with strict xhtml dtds besides those links at W3C? Sorry for this non CSS related topic but just hope the list could help clear my confusion :) With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
RE: [WSG] DTDS and which to use?
Uhhh this project requiresrebuilding the site from tables to css and to xhtml strict. I can feel my nightmare next to me already. I do not know why W3C validator is validating those codes as error when it looks perfectly fine to me.Unless the codings are very different from transitional DTD? 2morrow I am going to spend my entire day studying this XHTML strict. With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 02/25/04 02:59:21 To: [EMAIL PROTECTED] Subject: RE: [WSG] DTDS and which to use? I've found for new sites without a lot of forms or pre-existing content, building to XHTML1.0 Strict makes sure I have a disciplined, well structured site that quite easily validates and styles with CSS.I have to keep applying discipline to rid myself of old sloppy coding habits.Validating to XHTML1.0 strict is like my childhood piano teacher sitting next to me with a ruler rapping me on the knuckles when I got my scales wrong.A pain in the neck (well actually knuckles) but splendid way to learn the discipline required to do the job properly. However re-building an existing site to XHTML1.0 Strict is a nightmare. It's far too tight a standard to build to, and not enough benefits to justify the effort involved, unless the client's willing to pay me to do it. (Haven't found one that cares that much yet).In fact for one site, the best I could do was make sure it validated to HTML4.01 transitional.But at least it validated which is more than it did before!I'll tighten it up next time around. Cheers Mike Kear Windsor, NSW, Australia AFP Webworks http://afpwebworks.com * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
Re: [WSG] WSG Member Countries
Thanks for the info. I was just thinking about how many subscribers there are from Asia. Hope the user base from Singapore will increase as this is where I am at now. With Regards, Jaime Wong ---Original Message--- From: [EMAIL PROTECTED] Date: 02/19/04 21:32:57 To: [EMAIL PROTECTED] Subject: [WSG] WSG Member Countries Just thought you all may be interested in the WSG user base. 136 Australia 2 Austria 6 Belgium 8 Brazil 8 Canada 2 Denmark 1 Finland 1 France 8 Germany 1 Iceland 3 India 1 Indonesia 1 Iraq 4 Italy 1 Jordan 4 New Zealand 1 Norway 1 Peru 2 Philippines 1 Portugal 2 Russia 1 Scotland 2 Singapore 3 Spain 3 Sweden 1 Switzerland 3 The Netherlands 18 United Kingdom 1 Ukraine 45 USA Looks like we're missing only the African continent (and Antarctica I guess). P * The discussion list for http://webstandardsgroup.org/ * . IncrediMail - Email has finally evolved - Click Here
RE: [WSG] Padding/Margin in Opera
Doh careless careless! Thanks for the check James:) With Regards, Jaime Wong ---Original Message--- From: [EMAIL PROTECTED] Date: 02/20/04 06:54:07 To: [EMAIL PROTECTED] Subject: RE: [WSG] Padding/Margin in Opera Not actually related to your problem, but you dont seem to have closed your head tag on the home page, creating problems validating. -Original Message-From: JW [mailto:[EMAIL PROTECTED] Sent: Friday, 20 February 2004 12:03 AMTo: WSG - CSS ListSubject: [WSG] Padding/Margin in Opera I am converting my entire site from table to css layout. SO far so good until this page! IE6, NS7 and Mozilla Phoenix till Firebird shows ok except for Opera. Attached are the screenshots. Somehow Opera seems to push the footer down. http://designs.sodesires.com/sodcss/index.htmlis where it is located. Test Site. With Regards, Jaime Wong IncrediMail - Email has finally evolved - Click Here IncrediMail - Email has finally evolved - Click Here
Re: [WSG] Going Mad with pleasing the browsers
HiRyan
Thanks for thereply.
As for the menu
#mainnav ul li #services{
background-image: url(../../images/global/mainnav/services.gif);
background-repeat: no-repeat;
height: 113px;
width: 82px;
background-position: left top;
display: block;
padding-right: 10px;}
I haven't seen any problems from my side in IE. You mentioned using voicefamily. What is that? Dumb question I know but I have no idea what it is. IE has that padding problem only for the 1st div in the main container right?
For #contentwrapper and #contentcontainer, I used 2 instead of one because I needed the background image to synchronise. Didn't even know I got around not using hack by doing this. I am very new to all these so I am doing it through trial and error. How would you do it? Needed 3 background images due to the gradients.
I still haven't find a way to solve these problems: Anyone knows how to?
1) Opera only: The hover at the main navigation on the top of the page is not working.
2) Netscape only: For short page - Netscape refuses to show the background because the sidebar (column 2) is floated to the right and it is longer than the 1st column. It will show the background if the 1st column is longer but that is not what I want. I do not want to be restricted. I want flexibility of text length in either columns.
Best Wishes
Jaime
---Original Message---
From: [EMAIL PROTECTED]
Date: 02/03/04 21:56:24
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Going Mad with pleasing the browsers
That's the thing though - you'll have to use hacks. Now, hacks are commonplace in order to maintain browser compatibility in CSS. We can all entend a big poop-covered handshake over to our Microsoft boys for placing us in this position. Understand that it is the fault of the browsers and not of the language itself that CSS hacks are completely necessary if you are going tableless and have either padding or border properties in your CSS file. Margins don't cause problems.If you are unfamiliar with the box model, here's a short rundown (aka why you need to use CSS hacks) ... and also, your little "be nice to netscape" rule there is technically a hack as well. cough ;) we'll let that one slide heh heh.Say you have a div, in your case controlled by #contentwrapper#contentcontainer {
position: relative;
width: 747px;
background-image: url(../../images/global/backgrounds/contents_tiler.gif);
background-color: #365878;
background-repeat: repeat-y;
background-position: left top;
}#contentwrapper {font-size: 1em;text-align: justify;line-height: 1.8em;background-image: url(../../images/global/backgrounds/border.gif);background-repeat: no-repeat;background-position: right top;padding-bottom: 1px; /*Fix NS 7 bug where it breaks footer from the contents container */padding-top: 30px;rem_padding-left: 20px;padding-right: 35px;}Let's cut out all the other garbage for length's sake and deal with hack-worthy material.#contentcontainer {
width: 747px;
}
#contentwrapper {padding-bottom: 1px; /*Fix NS 7 bug where it breaks footer from the contents container */padding-top: 30px;rem_padding-left: 20px;padding-right: 35px;}You've chosen a most interesting way to get around not using a hack by placing the box within a box, and then not specifying a width in the inner container. I would opt for a hack here and save some filesize. In addition to hacks for IE, it's common to see them for Opera as well. Opera users though are much more keen to actually updating their software when a new version comes out. Why some people are still using IE5.0 at home is beyond me. Maybe they didn't get the memo.In other areas, there are some possible problems.#mainnav ul li #services{
background-image: url(../../images/global/mainnav/services.gif);
background-repeat: no-repeat;
height: 113px;
width: 82px;
background-position: left top;
display: block;
padding-right: 10px;}Your width will not be 82px there, it will be 92px in IE. (82 + 10). If you hadborder: 1px solid #000;in there as well, it would be 1 + 82 + 10 + 1 or 94 pixels. That's what the screwed up box model handling of IE does, adds width plus border size, plus padding to determine the size of the overall box. You're bound to run into a wall somewhere along the line if you're doing tablefree layouts hackless. I always use the voice-family flavour to spoof the retarded browsers, but there are other methods that work equally as well. I don't particularly like using hacks either, and I see the basis behind this recent tableless layout deal as well - tables are for tabular data, not for web layouts. When the table property was created, layouts were not in the minds of those making it. It's all about meaning. That's why there was the definition wars in here awhile back. What constitutes their correct usage? Text definitions or a broader spectrum? I say broader spectrum within reasonable boundaries.I wish I could say there will come a day when hacks are but a laughable history. Hopefully I'll live to see it,
Re: [WSG] Going Mad with pleasing the browsers
I'm trying to avoid using hacks if possible.
Now what I need to find out is what are the causes of the problems. Feeling so dazed by all these.
Best Wishes
Jaime
---Original Message---
From: [EMAIL PROTECTED]
Date: 02/03/04 12:05:22
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Going Mad with pleasing the browsers
It took me a week's worth of work before I actually smoothed out my CSS enough to the point where it tested correctly in all browsers that are CSS-layout capable. The rest just get fed the barebones HTML with sparse images, and a short sweet notice about upgrading their browser with download links :)In your case, look up how to implement the Opera-friendly and IE-friendly CSS hacks into your CSS file. It will most likely fix at least one of the problems below, in addition to other problems that are likely yet unforseen :) After you get in the habit of div/CSS layouts, it'll go much quicker. Probably back down to a day at most. I'm sure the first time we all dealt with table layouts it was tricky at first as well.--Ryanhttp://www.theward.netJW wrote:
Hello everyone
I am new to the list andenjoyed reading the woesand sorrows. J/K :)
I am fairly new to building a siteusing pure CSS.After reading so much about CSS and that it seemsthat the trend is shifting to no tables, I finally gave in to tryingto start on my current project with using CSS.Using tables, I would have completedimplementing the site in a day. But with CSS, I took 3 days! Most of the time, trying to find outwhyMozilla, Netscape, IE, Opera are trying to drive me to the grave by rendering different results...
But despite all these, I can'tdeny the fact that I somehow enjoy thetorture. CSS is rather fun once you immerse yourself into it especially when you are not an expert in it. Have been visiting Max Designs for guidance. I see his website more than my TV dressing table these few days.
These 2 are the test pages: -
Long Page: http://designs.sodesires.com/maxprime/index.html
Short Page: http://designs.sodesires.com/maxprime/index_short.html
The browsers I used to test : IE 6, NS 7, Mozilla 0.7, Opera 7.02
Problems I can't solve: -
1) Opera only: The hover at the main navigation on the top of the page is not working.
2) Netscape only: For short page - Netscape refuses to show the background because the sidebar (column 2) is floated to the right and it is longer than the 1st column. It will show the background if the 1st column is longer but that is not what I want. I do not want to be restricted. I want flexibility of text length in either columns.
3) Netscape only: As the footer has top padding in order to position the contents in it, Netscape shows a white area above the footer. In order to fix it, I have to put a bottom padding for my content wrapper. It doesn't matter if it is 1px or 10px etc. As long as I put a bottom padding, Netscape is happy. Anyone knows why?
Below isthe layout of the div I have for the contents section and the CSS for it: -
div id="contentcontainer"div id="contentwrapper"div id="sidebar"/divdiv id="contents"/div/div/div
#contentcontainer {position: relative;width: 747px;background-image: url(../../images/global/backgrounds/contents_tiler.gif);background-color: #365878;background-repeat: repeat-y;background-position: left top;}
#contentwrapper {font-size: 1em;text-align: justify;line-height: 1.8em;background-image: url(../../images/global/backgrounds/border.gif);background-repeat: no-repeat;background-position: right top;padding-bottom: 1px; /*Fix NS 7 bug where it breaks footer from the contents container */padding-top: 30px;rem_padding-left: 20px;padding-right: 35px;}
#sidebar {margin-top: 30px;float: right;width: 25%;}
#contents{width: 70%;background-position: right top;padding-right: 3%;
}
Being my very 1st attempt using CSS and no tables to build a site, please do let me know if I did something wrong. I have no idea how safe it is to present this to the customer. Almost feel like presenting the table layout instead because I will know that nothing will go wrong with the layout. Thank you!
Best Wishes
Jaime
IncrediMail - Email has finally evolved - Click Here
