[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] html email styling question in body
The references you mention may be referring to putting the whole style section within the body tag. I do this and I found it to be useful for bypassing the trickery of some web-based email systems that strip out any style information it finds within the head tag. i.e. html head /head body style /style /body /html Hope this helps, Cade. -Original Message- From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED] On Behalf Of Tee G. Peng Sent: Monday, 16 October 2006 4:50 PM To: wsg@webstandardsgroup.org Subject: [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] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Relative positioning and Netscape 6
I have to agree on that. Netscape 6 - unless you hgave a strangely high number of visitors using that browser - is not worth bothering about. Alex From: Nick Cowie [EMAIL PROTECTED] Reply-To: wsg@webstandardsgroup.org To: wsg@webstandardsgroup.org Subject: Re: [WSG] Relative positioning and Netscape 6 Date: Mon, 16 Oct 2006 10:32:04 +0800 The first question I would ask is why are you worrying about Netscape 6? And which version 6, 6.1 and 6.2, as they are all different? It was a commercial decision to release Netscape 6 and they all based on prerelease versions of Mozilla 0.9.x. So unless Netscape 6 shows up in your site stats, I would ignore the problem and concentrate on get the site right in the browsers your visitors use. -- Nick Cowie http://nickcowie.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** _ Be the first to hear what's new at MSN - sign up to our free newsletters! http://www.msn.co.uk/newsletters *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] different spacing across browser p in li
I was wondering if someone knew why there is a larger spacing above the form in Internet Explorer? http://www.clickfind.com.au/advertiser/register.cfm in Firefox it looks ok, the ol id=lth is right above the form Also wondering if someone could answer the question someone else asked on this list in regards to a p tag in a li tag, is it needed? To me it is a paragraph, but I could be wrong, do you not use a p tag within a list item? Kind regards, Taco Fleur - watch our new video online! http://pacificfox.tv/ Pacific FoxT free call 1800 032 982 or mobile 0421 851 786 - fax 07 3414 6464, international +61 7 3325 5103 www.pacificfox.com.au http://www.pacificfox.com.au/?source=email an industry leader with commercial experience since 1994 . our services: * online, print, marketing information technology * website, branding, logo, business cards, letterheads * hosting, e-commerce, domain names, sms solutions, streaming video and complete web strategies *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] different spacing across browser p in li
Seems to be the inline clear:left on your form which is causing the trouble in IE. As for using other block level elements within a list item, I don't see the need for them unless your list items contains more than one line of content. If you want to differentiate between two paragraphs or if the content is quite long, then definitely use p tags, but in your case your content is only 2-3 words long. Lists are perfectly valid containers of content by themselves and I think they're fine in your case. On Mon, 16 Oct 2006 20:51:21 +1000, Taco Fleur [EMAIL PROTECTED] wrote: I was wondering if someone knew why there is a larger spacing above the form in Internet Explorer? http://www.clickfind.com.au/advertiser/register.cfm in Firefox it looks ok, the ol id=lth is right above the form Also wondering if someone could answer the question someone else asked on this list in regards to a p tag in a li tag, is it needed? To me it is a paragraph, but I could be wrong, do you not use a p tag within a list item? Kind regards, Taco Fleur - watch our new video online! http://pacificfox.tv/ Pacific FoxT free call 1800 032 982 or mobile 0421 851 786 - fax 07 3414 6464, international +61 7 3325 5103 www.pacificfox.com.au http://www.pacificfox.com.au/?source=email an industry leader with commercial experience since 1994 . our services: * online, print, marketing information technology * website, branding, logo, business cards, letterheads * hosting, e-commerce, domain names, sms solutions, streaming video and complete web strategies *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Tyssen Design www.tyssendesign.com.au Ph: (07) 3300 3303 Mb: 0405 678 590 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Re: Double space after a period
I've looked around for a stable solution which doesn't involve putting
nbsp, emsp; etc all over the content (that's presentational :-) ) and
can only come up with using the old s tag (for strikeout):
s{
padding-right: 1em;
text-decoration : none;
}
then, blah blahs./sblah blah. It seems to work, but I'd be grateful
if someone could check it in odd browsers such as Lynx (Rene?). You can
see a working test here:
http://www.rhh.myzen.co.uk/rhh2007/locations/constantine/doublespace.html
Note: it needs a trans doctype if it's to validate . . .
Thanks.
--
Best Regards,
Bob McClelland
Cornwall (UK)
www.gwelanmor-internet.co.uk
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] Pure CSS dropdown Menu, take II
I followed all suggestions made after I published the first demo and came up with this... Demo: http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/ Article: http://www.tjkdesign.com/articles/Pure_CSS_Dropdown_Menus.asp Keyboard users can go from one top level item to the next without having to go through the nested links (the enter key toggles the sub-menus). Regarding pointing devices; I went with vertical sub-menus rather than horizontal ones (avoiding diagonal paths) and I added a 10px cushion all around the sub-menus. Is that good enough now? :) --- Regards, Thierry | www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Pure CSS dropdown Menu, take II
Thierry Koblentz wrote: Is that good enough now? :) wonderful! i need to tidy a horizontal menu on my nephew's site. may i use this and is a tutorial on how to make this happen forth coming (along with the js)? i see you have copyrighted the process; will you have a problem with sharing your find with us? regards, dwain *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Pure CSS dropdown Menu, take II
[EMAIL PROTECTED] wrote: Thierry Koblentz wrote: Is that good enough now? :) wonderful! i need to tidy a horizontal menu on my nephew's site. may i use this and is a tutorial on how to make this happen forth coming (along with the js)? Hi Dwain, I don't think I'll write a *tutorial*. Rules are well commented and the script is plug-and-play. I'd say the best is to lift the whole page and start from there; removing what you don't need. i see you have copyrighted the process; will you have a problem with sharing your find with us? I don't have any problem sharing [1], so feel free to use it for your nephew's site. [1] http://creativecommons.org/licenses/by-nc-sa/2.0/ --- Regards, Thierry | www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Cleaning the body
At 10/16/2006 12:49 PM, [EMAIL PROTECTED] wrote: I'm trying to clean as much JS crud from the body as I can. My JS skills are still somewhat limited. I have a couple methods I wish to eliminate from the body but still have available. How do I do it? Google unobtrusive javascript to learn how you can (and arguably should) eliminate ALL scripting from your HTML file, leaving only the script tag script src= ... itself. In a nutshell, in an external script you set the onload event to trigger your initialization function which applies behaviors to specific elements on the page. In the same way that we're cleanly separating CSS presentation from HTML markup, so you can cleanly separate JavaScript behavior from markup. The connectors between these layers are your tag names, ids, and classes. Regards, Paul *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Pure CSS dropdown Menu, take II
Works fine in FF 1.5.0.7 if you want to add that to your list of Win browsers. ;) On Tue, 17 Oct 2006 03:21:00 +1000, Thierry Koblentz [EMAIL PROTECTED] wrote: I followed all suggestions made after I published the first demo and came up with this... Demo: http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/ Article: http://www.tjkdesign.com/articles/Pure_CSS_Dropdown_Menus.asp Keyboard users can go from one top level item to the next without having to go through the nested links (the enter key toggles the sub-menus). Regarding pointing devices; I went with vertical sub-menus rather than horizontal ones (avoiding diagonal paths) and I added a 10px cushion all around the sub-menus. Is that good enough now? :) --- Regards, Thierry | www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Tyssen Design Web print design services www.tyssendesign.com.au Ph: (07) 3300 3303 Mb: 0405 678 590 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] list-image cross browser position
To the UL have u try it :
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */
And for the Flickering background image in IE is because u have in
tools Internet Options Temporary Internet Files Settings
chose Every visit to page, sow everytime u r need the image a make a
request sow the time that is needed to load the image is the time you
dont see it.
U can see some examples here:
http://www.artideias.com/artigo/blog/usando-background-image-no-internet-explorer
or http://www.fivesevensix.com/studies/ie6flicker/
I think u with this 2 solutions u solve ur problems
Cheers,
Gaspar
Make it simple for the people
--
http://www.artideias.com
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
RE: [WSG] different spacing across browser p in li
Thanks, any suggestions on how to solve that? I can't remove the clear:left Kind regards, Taco Fleur free call 1800 032 982 - fax 07 3414 6464, international +61 7 3325 5103 www.pacificfox.com.au an industry leader with commercial experience since 1994 . our services: - online, print, marketing information technology - website, branding, logo, business cards, letterheads - accept online credit card payments www.commerceengine.com.au - domain registrations, .com for as low as fifteen dollars a year, .com.au for fifty dollars two years! -Original Message- From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED] On Behalf Of John Faulds Sent: Monday, 16 October 2006 9:21 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] different spacing across browser p in li Seems to be the inline clear:left on your form which is causing the trouble in IE. As for using other block level elements within a list item, I don't see the need for them unless your list items contains more than one line of content. If you want to differentiate between two paragraphs or if the content is quite long, then definitely use p tags, but in your case your content is only 2-3 words long. Lists are perfectly valid containers of content by themselves and I think they're fine in your case. On Mon, 16 Oct 2006 20:51:21 +1000, Taco Fleur [EMAIL PROTECTED] wrote: *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Cleaning the body
In a short, without digging into event model and stuff, you have to give unique id for every element you would like to hijack (or be able to find them in the DOM) For example: div id=sample-div-1 onkeydown=function1()… could be transformed to div id=sample-div-1… JavaScript part: document.geteElementById(sample-div-1).onkeydown = function1; // attention! no brackets and so on. best regards, Dmitry Baranovskiy On 17/10/2006, at 5:49 AM, [EMAIL PROTECTED] wrote: I'm trying to clean as much JS crud from the body as I can. My JS skills are still somewhat limited. I have a couple methods I wish to eliminate from the body but still have available. How do I do it? onkeydown=function1(); onsubmit=function2(); oncontextmenu=return true; It's for an internal app on IE6, so let's not have a whole series of posts about how evil I am for taking user control away or how JS can be turned off, etc. I know all that. It's an internal app. There will be no Opera or Firefox or Lynx or Safari. -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] different spacing across browser p in li
Why can't you remove it? On Tue, 17 Oct 2006 10:08:56 +1000, Taco Fleur [EMAIL PROTECTED] wrote: Thanks, any suggestions on how to solve that? I can't remove the clear:left Kind regards, Taco Fleur free call 1800 032 982 - fax 07 3414 6464, international +61 7 3325 5103 www.pacificfox.com.au an industry leader with commercial experience since 1994 . our services: - online, print, marketing information technology - website, branding, logo, business cards, letterheads - accept online credit card payments www.commerceengine.com.au - domain registrations, .com for as low as fifteen dollars a year, .com.au for fifty dollars two years! -Original Message- From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED] On Behalf Of John Faulds Sent: Monday, 16 October 2006 9:21 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] different spacing across browser p in li Seems to be the inline clear:left on your form which is causing the trouble in IE. As for using other block level elements within a list item, I don't see the need for them unless your list items contains more than one line of content. If you want to differentiate between two paragraphs or if the content is quite long, then definitely use p tags, but in your case your content is only 2-3 words long. Lists are perfectly valid containers of content by themselves and I think they're fine in your case. On Mon, 16 Oct 2006 20:51:21 +1000, Taco Fleur [EMAIL PROTECTED] wrote: *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Tyssen Design Web print design services www.tyssendesign.com.au Ph: (07) 3300 3303 Mb: 0405 678 590 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Pure CSS dropdown Menu, take II
John Faulds wrote: Works fine in FF 1.5.0.7 if you want to add that to your list of Win browsers. ;) Duh! I have versions 0.8 and 1.5 and I totally forgot to include these two. Thanks John. --- Regards, Thierry | www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] different spacing across browser p in li
Taco Fleur wrote:
Thanks, any suggestions on how to solve that? I can't remove the
clear:left
You can hack in a...
form {margin-top: -15px}
...(or another value) for IE/win only - using your favorite hack.
Georg
--
http://www.gunlaug.no
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] Percentages
Title: Message I'm not a CSS newbie, and not a CSS Pundit either. What I'd like to know, is there anything inherently wrong with using percentages for a three column floated layout? Say my outermost container is720px wide, is it problematic if the column div widths are 23%, 52%, and 25% -TIA ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] Percentages
TomGou wrote: I'm not a CSS newbie, and not a CSS Pundit either. What I'd like to know, is there anything inherently wrong with using percentages for a three column floated layout? Say my outermost container is 720px wide, is it problematic if the column div widths are 23%, 52%, and 25% -TIA There is nothing inherently wrong with using pixels, ems, or percent for a three column float layout. And there are variations using combinations. Percent layouts used with positive and negative margins are often stable, robust, and work well cross-browser. They are sometimes enclosed in a pixel width wrapper, a min/max pixel width wrapper, or various combinations of pixel, em, and percent wrappers. The method that is best is the one that solves the problem at hand. Best, ~dL -- http://chelseacreekstudio.com/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
