Re: [css-d] [OT] how hard would it be...
On Wednesday 11 April 2012 00:23, Christian Hanvey wrote: [snip] I could not find anything in the spec referring as to why we only use the American spelling rather than International spelling. Cheers! Completely OT for this list IIUC. The W3C has mailing lists too. The original authors of HTML were American. First in. first served. -- Michael __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Adblocker and css classes/ids
On Monday 20 February 2012 07:08, Graham Hays wrote: Hi Barney (ad anyone else) Personally I'm not a lover of random classnames (or filenames) - if a class does something then I call it that. The problem I had was that this wasn't an advert as such - on our site we had used the folder name advertising to hold pages relevant to clients enquiries (how do I advertise on your site). The downside was it knocked out all the images on the page but otherwise left the page intact! Ah well, just something else to have to check in future. The directory names ClientQueries or ClientFAQ would be just as relevant. Your own imagination is your key here. Presumably at this stage a find and replace is an annoyance to you, but not a deal-breaker. -- Michael __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css measures - em grid system makes sense ?
On Saturday 12 November 2011 01:52, mem wrote: On Nov 11, 2011, at 2:51 , David Laakso wrote: I'd suggest that you simply put a full and complete rough layout /on your server/ that reflects your intended final goal. Allow it to speak for itself. No novella to accompany it is needed. http://help.nuvemk.com/css/layout_structure_home.pdf A quick word to the wise. Right now PDF's and MS Office documents are not the flavour of the month. Problems with embedded fonts. I'm sure that this is a trusted source, but for the moment i would look to be supplying examples as exported images instead. http://support.microsoft.com/kb/2639658 http://technet.microsoft.com/en-us/security/advisory/2639658 -- Michael __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] PNG IE 6
On Saturday 09 July 2011 04:49, david wrote: And we've been through this before. My employer uses IE6 for its 1600+ employees. We do this because some of our mission-critical corporate web apps don't work in anything except IE6 (including newer versions of IE). And for solutions to *YOUR* CSS issues - of which there will be many: Install another browser beside IE in your industry. Firefox, Chrome, Opera or Safari - i don't care. Mark all your mission critical apps as legacy and start seeking replacements ASAP. Prevent IE from accessing through the corporate firewall because it is an inherent security threat. Perhaps pinhole the firewall for any external servers that run your mission critical apps on. To do anything less could put your corporate, employee and customer data at risk because the Trident engine was seriously flawed. This is a serious issue that should be given a high priority corporate wide. I'll leave the last word on this to Microsoft. http://www.ie6countdown.com/ -- Michael __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] problem with overflow: visible under IE8 resizing the containing node
On Saturday 16 April 2011 16:19, David Hucklesby wrote: [snip] Without a DOCTYPE, browsers are in quirks mode. Real browsers still obey CSS rules except for a couple of things like box sizing. All versions of IE will behave like IE 5.5 though. If you want to keep browsers in quirks mode, including IE 6 and 7, but want IE 8 and 9 to be as standard as they can be, add the X-UA-Compatible META element to the HEAD of your document, or configure your server. The XML prolog (XHTML), or an SGML comment (HTML) forces quirks mode as well if you wish to force IE6 only. -- Michael __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] :: ie/7.0 ::
On Thursday 07 October 2010 12:12, David Laakso wrote: Why does this page [1] crash IE/7.0 ? I'm wondering - does anyone else drop all posts/threads from repeat OT posters? I'm considering it here. I have seen some repeatedly being told this is not the appropriate forum for their questions but still offending. -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] Ignored (was - Embedding an .mov file: embed src)
On Wednesday 15 September 2010 06:35, Lalena wrote: Hi everyone, You are being generally ignored because your question has nothing to do with CSS and is therefore considered off topic [OT]. http://css-discuss.org/about.html Try the webdesign list here: http://webdesign-L.com/ HTH -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type sizes?
On Friday 10 September 2010 00:18, tedd wrote:
[snip]
You can also use em's, such as:
body
{
font-size: 1em;
font-weight: normal;
font-family: helvetica, arial, sans-serif;
}
and then base everything else upon that, such as:
That isn't a good idea. If you specify the body font in em units, when a user
changes (in IE6 or IE7) from Medium to Larger, rather than getting an
expected small percentage in increase, IE exaggerates the size change. Hence,
comes the recommendation to use:
body { font-size: 100%; }
http://www.alistapart.com/articles/howtosizetextincss/
(2007-11-20)
HTH
--
Michael
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Artifact on CSS dropdown menu
On Friday 03 September 2010 17:42, Chris F.A. Johnson wrote: On Fri, 3 Sep 2010, Michael Adams wrote: I see a different problem: http://cfajohnson.com/testing/quickconvert.jpg I dont see the menu wrap as an issue (i dont have a designers bone in my body). I intend to extend the site to include additional options over time, with the next one being cullinary measures. That is a sign that my menu is working as intended and it even occurs in Firefox with text zoom. Thanks -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Artifact on CSS dropdown menu
On Friday 03 September 2010 20:12, Alan Gresley wrote:
The artifact is the border here.
.horizontalmenu ul li ul {
left: -999em;
top: 2em;
border-top: 1px solid #222; /* delete */
position: absolute;
display: block;
z-index: 100;
}
And add the below to your stylesheet.
.horizontalmenu ul li ul li:first-child a {
border-top-width: 1px;
}
BTW, IE7 also supports :hover on arbitrary elements.
Thanks Alan, will make those changes in the morning. Greatly appreciated.
--
Michael
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Artifact on CSS dropdown menu
This is a concept website that i am working on. The main issue i am having with it is a line which extends of to the left when the ul:hover is activated in various browsers. There is a gap of a couple of pixels between the parent li and the first child li which seems to get exagerated on different browsers as well. Quite pleased to see IE8 now supports hover on arbitrary elements. http://www.quickconvert.net/index.html TIA -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] Out of the stone age
On Thursday 26 August 2010 06:07, Lineberger, Scott wrote: [snip] There has to be a way to streamline this. Due to the age of this server and the legacy app, it seems my options are limited. checkboxes / tickboxes -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ID vs. Class [solved]
On Tuesday 20 July 2010 15:37, Chris Blake wrote: I like to treat class and id semantically -- or at least according to my understanding of what that means. SOUNDS GOOD TO ME! But there is nothing really wrong with a combination of both:- code div id=this1 class=content Content /div div id=this2 class=content More content /div /code This allows you to make these divs behave similar with the .content class, but give specific attributes to each as needed by ID. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fonts, fall-backs Unicode
On Tuesday 13 July 2010 20:57, Philip Taylor (Webmaster, Ret'd) wrote:
If I have a page such as the following :
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
http://www.w3.org/TR/html4/strict.dtd; html
head
meta http-equiv=Content-Type content=text/html; charset=utf-8
titleArmenian test/title
style type=text/css
BODY {font-family : Arial Unicode MS, sans-serif}
/style
/head
body
h1Եւ երկիր էր աներևոյթ և անպատրաստ. և խաւար ի վերայ անդնդոց. և
Հոգի Աստուծոյ շրջէր ի վերայ ջուրց/h1
/body
/html
I have presumably chosen my primary font not only because I feel its
aesthetics are appropriate but also because it supports the necessary
subset of Unicode to correctly display the characters that make up
the page. But if for some reason the visitor's browser does not have
access to (in this case) Arial Unicode MS, and falls back to the
generic sans-serif, there is (as far as I can see) no way of
guaranteeing that the page will still display correctly.
Is there, therefore, in CSS, some way of specifying as a part of the
font fallback sequence that any font selected as a result of fallback
must support a specific subset of Unicode such that the page can be
guaranteed to display correctly provided that such a font does in
fact exist on the visitor's machine ? And is there any way, presumably
using a combination of HTML and CSS, to display a suitable error message
using solely ASCII characters if such a font cannot be found ?
Would it help to create a page with all the Unicode chars in the range you are
using and ask who can see how many based on font selections on a per
paragraph basis. For *my* Linux Nimbus Roman No9 L may be a well populated
serif font and Nimbus Sans L as sans serif (dunno i haven't gone into it
that much). You could also get replies from Mac, Windows 7, Vista and XP
users and try for the best combinations. I don't know the maximum fonts you
can have in a CSS fonts list - anyone?
Alternatively, if you are dealing with particularly uncommon glyphs it could
pay to use images of the ones you want instead.
HTH
--
Michael
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fonts, fall-backs Unicode
On Tuesday 13 July 2010 23:02, Philip Taylor (Webmaster, Ret'd) wrote: I think that there is a great deal of unintentional racism in the US-English-centric web that we use today, but the last time a group of us tried to raise this as a serious issue within the CSS working group, one of the joint Chairmen had an apoplectic fit, so I have little hope that this will be addressed in the short term, much as I would like it to be. No racism intended from my reply. I was thinking that the OP's question originated in rare mathematical symbols. I recently helped in such an issue on the OpenOffice.org list where the OP wanted to know how to get a R glyph with a slash superimposed on top. No single unicode glyph exists for this but there are a range of glyphs which can overlay others including the slash. Vary rare request. Often with math formulas, browsers produce broken output and it is as much of an issue as languges though less common. In my understanding with languages the user has adequate fonts loaded on their box but the web dev pretty much can only offer sans-serif or serif to them and hope that the box/browser is well set up. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE hacks - css conditions
On Saturday 26 June 2010 20:31, Alan Gresley wrote: Michael Adams wrote: A few years back i dropped conditional comments in favour of the CSS IE @import hack[1][2][3]. Now i find myself in a position where i want to send one thing to ie7 ie8 and another to all other browsers. What i want to do is give CSS rounded corners and opacity to all browsers that support it. All current versions of IE do not support rounded corners - though ie9 may in the future. IE9 will have support for rounded corners. I will pass alpha PNG images to ie7 ie8. Or you could send invalid CSS (like the import hacks) that IE8 only sees. http://css-class.com/test/bugs/ie/ie8-parsing-backslash.htm I myself just do the best with IE8 without rounded corners. Some may not have that option. Mainly solved with a php include, at least now i only have to edit one file. -- Cheers __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE hacks - css conditions
A few years back i dropped conditional comments in favour of the CSS IE @import hack[1][2][3]. Now i find myself in a position where i want to send one thing to ie7 ie8 and another to all other browsers. What i want to do is give CSS rounded corners and opacity to all browsers that support it. All current versions of IE do not support rounded corners - though ie9 may in the future. I will pass alpha PNG images to ie7 ie8. Because of no PNG alpha support I may down the track add GIFs for ie7 but that is low priority. Amaya is the only other modern browser i am aware of that does not support rounded corners (and people using Amaya for browsing have much greater issues). My main problem with conditional comments is that for a small but growing non CMS website *each existing webpage needs to be edited one by one*. With CSS hacks the hack modification affects the whole site instantaneously. With the advent of IE9 i don't want to have to backtrack and edit every page. Unfortunately we cannot pre-guess what CSS hacks will work so i find myself in the position where i may have to return to using conditional comments. I just wen't to re-learn this lost tool and Microsofts very first sentence on the topic rankles[4]. One of the most common operations performed in a Web page is to detect the browser type and version. I would have to use: !--[if (gte IE 7) (lte IE 8)] link href=iePNGalpha.css rel=stylesheet type=text/css / ![endif]-- !--[if lt IE 7] link href=ieGIF.css rel=stylesheet type=text/css / ![endif]-- All of a sudden i find myself in a position where i want to push for CSS conditionals like: @import url(iePNGalpha.css) IE7; Thanks for reading my rant - comments? IE @import hack: I first found here [1] http://annevankesteren.nl/2005/10/ie-import-hack more [2] http://imfo.ru/csstest/css_hacks/import.php good reasons [3] http://www.gunlaug.no/contents/wd_additions_12.html Grr... conditional comments first sentence: [4] http://msdn.microsoft.com/en-us/library/ms537512(VS.85).aspx -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] character encoding?
On Wednesday 09 June 2010 03:50, r...@catjuggling.com wrote: I apologize if this is considered off-topic, but it's here that I find people talking most about validating pages. I am trying to find out why my documents are validated as Tentatively checked as HTML 4.01 Strict with warnings about No Character Encoding Found! Falling back to windows-1252. HTTP header sniffing shows no character encoding there. See: http://web-sniffer.net/ Your page shows UTF8 but the server is not sending it in the header. I would look to the server setup to remedy that. Your page does validate ok by direct upload so there is no problem there. -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] tiny font in Safari and Chrome
On Saturday 29 May 2010 08:50, Angela French wrote:
I'm building a new site and I just discovered that Safari and Chrome render
the font very small.
My css looks like this:
body { font-size:100%; }
p {font-size: .8em;}
Read this before continuing:
http://informationarchitects.jp/100E2R/
HTH
--
Michael
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] tiny font in Safari and Chrome
On Saturday 29 May 2010 11:58, Philippe Wittenbergh wrote:
Have you had a look at your page with the WebKit Inspector ? It would
immediately tell you that WebKit based browsers (Safari, Chrome) load a
stylesheet '/Styles/safari.css' with only one rule:
body {
font-size: 10px;
}
That overrides what you set in '/Styles/GlobalStyles.css'
Ew, is this the norm for these browsers or is it the norm for the Mac
versions?
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS3 Please code and Explorer support
On Monday 29 March 2010 17:14, David Hucklesby wrote: On 3/28/10 8:59 PM, Dave M G wrote: CSS-d, I got some code from the CSS3 Please web site: http://css3please.com/ For the box-shadow effect, it indicates that it can be used in IE 6, 7, and 8. However, when I look at it with my windows machine, which has IE8, it doesn't work. The box shadow is rendered like 2 pixel wide border on the right and bottom sides. No gradient or transparency. I'd prefer to see an example of your page. Does it validate otherwise, is IE in quirks or backwards compatibility mode? Those Microsoft filters only work when the element they are applied to has layout.[1] Try adding zoom: 1; to the ruleset for the filter... I understood 'zoom' to be a Microsoft proprietary CSS property which does not validate. I would set a height or width value instead which achieves the same purpose. http://reference.sitepoint.com/css/zoom -- Michael --- __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] alpha opacity filter in FF
On Wednesday 10 February 2010 11:42, Supita wrote: Hello to all: I'm working on some panels. We need that, when the text doesn't fit in one line, the text be cutted at the end of the line, and it looks like it is fading. I can do that effect using filter: progid:DXImageTransform.Microsoft.Alpha(...); in IE, in the div that contains all my rows. I don't know how to do it in Firefox. The rows have different background colors, so, I need that the fading effect doesn't depend on the background image. The only solution that I have for FF is using opacity, and it depends always on the background image. I need to know if I can do something like the gradient effect that filter: progid:DXImageTransform.Microsoft.Alpha(...); does on IE in FF, or if I just can not do it. I'll apreciate all your ideas :) Not a CSS solution, but you could use an overlaying SVG image with opacity gradient. Not much overhead and still validates. Won't work on IE but you already have an IE solution. -- Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] validating CSS
On Wed, 26 Aug 2009 22:57:36 -0400 Came this utterance formulated by jeffrey morin to my mailbox: I was discussing some CSS techniques the other day and someone brought up a point of a certain fix that I use not validating in the CSS validator. I have never really been overly concerned with validating my stylesheets as long as the html was good. Is there a certain benefit to validating your CSS or is it mainly just for purity sake? The CSS validator is a developers tool (as is the HTML validator). I use it to check for syntax errors. Having said that there is very little reason for using bad CSS nowadays. I have my IE8 CSS in a seperate file that the validator won't find. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Where do I make a suggestion for the Policies page?
On Tue, 04 Aug 2009 20:28:49 -0700 Came this utterance formulated by Theresa Mesa to my mailbox: Having refreshed my memory by reading the policies - so I don't continually get my hands slapped - I have a suggestion for a snippet of text to be added so that no one is surprised that the CSS Archive **is being indexed by Google**, so their question is likely to show up in a name search for themselves or their client. I found out the hard way (my client called me up) and licked my wounds for quite a while. The current text regarding that just isn't clear enough. In fact the subscription page insists the archives are only available to members. Either policy has changed or some member is pushing the mails to a google list? -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Removing the Blank Line/Space between Paragraphs
On Sun, 26 Jul 2009 17:22:59 -0400 Came this utterance formulated by Bob Rosenberg to my mailbox: At 16:13 +0900 on 07/26/2009, Philippe Wittenbergh wrote about Re: [css-d] Removing the Blank Line/Space between Paragraph: On Jul 26, 2009, at 3:46 PM, Bob Rosenberg wrote: I use the text-indent CSS parm to indent the first line of each paragraph. I have been requested to remove the blank line/space that occurs between paragraphs triggered by the /pp sequence of tags so the lines occur as one block of text with only the indention and the short line at the end of each paragraph signaling the paragraphs. Is there a CSS parm I can use to eliminate the blank line between the paragraphs and, if so, what parm do I use? parm ? You probably mean 'property'. Yes. I am just used to thinking of them as parameters (like with HTML Tags). They are basically the same thing. They have different names for a reason. Oh, and what most people call tags in HTML are elements. Most elements have two tags, opening and closing, some like HR do not have two. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] An easier way?
On Sun, 26 Jul 2009 17:24:59 -0400 Came this utterance formulated by David McGlone to my mailbox: Hi everyone, I know everyone here prefers that when a question is asked, that the poster upload an example on the web. Well is there any other way this could be accomplished? In order for me to put the work i've done on the internet would take too long because of the databases etc, etc. Save the page from Firefox and check your CSS works in it. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Colors in PShop vs. browser
On Thu, 23 Jul 2009 15:34:04 -0500 Came this utterance formulated by Lalena to my mailbox: Hi, has anyone else experienced seeing colors somewhat differently in Photoshop vs. a web browser? Everything looks significantly darker in Photoshop. It certainly adds an unnecessary obstacle to the design process! Any tips on why this might be happening, and how to alleviate it? (I'm trying to match the background of an image--it's an image of type--to a hexadecimal background color.) Offtopic, but at a guess look to gamma correction in photoshop. I use GIMP so can't be more help. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] SEO links
On Mon, 20 Jul 2009 00:09:07 -0400 Came this utterance formulated by Bob Rosenberg to my mailbox: At 20:47 -0500 on 07/18/2009, Reese wrote about Re: [css-d] Problem with all Mac browsers according to Brow: It isn't asnSEO-friendly as text links and SEO-friendliness is important. So long as each image has an ALT tag with the text, the SEO Police should be reading it and treating it as if it were the text itself. It isn't police but SE bots that need to be catered for. And it then depends on the program which ascribes the rating to each form of link. AFAIK text links still rate better. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Number click Photo Gallery
On Mon, 13 Jul 2009 10:52:44 -0400 Came this utterance formulated by Brian Curran to my mailbox: Hi All, I'm a beginner at web design, so What I'd like to do on one web page is to display a portfolio of pictures of buildings. I envision: On the left hand side of the page to have a list of building addresses, with each address followed by a list of numbers 1,2,3, and etc. Then the whole right hand side of the page will be for an image. My goal is for the user to click a number on the left side of the page, and then see a corresponding image appear on the right side of the page. I understand allot of people use this technique with thumbnails, but I don't have the room on the page for thumbnails, plus I like the number concept. I can probably float things around using CSS on my own, but I don't know the code to get the clickable number to active an image all on one page. Can anyone help? CSS is only a part of the technique required to do this. You may have more luck on a general HTML list or forum. I'd also look at javascript techniques. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Posting 101 [OT]
On Mon, 13 Jul 2009 11:31:21 -0400 Came this utterance formulated by Brian Curran to my mailbox: Can someone give me the Posting 101 on why my post was one long run-on line of text? I use Outlook, if that impacts anything??? This is way off topic for this list. General discussions of this nature are frowned upon here. If you are looking for buddies you are in the wrong place ;) Look to a change in the settings of your email client, or a new email client. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] double borders. A different story in IE?
On Thu, 16 Apr 2009 16:11:32 +0300 Came this utterance formulated by Jon Wickström to my mailbox: And yet you have a fake XML declaration in line 9 which does nothing that i can see. Still would validate though. It's a HTML-comment. I can't see what difference it would make. It was suggested IE goes into quirks mode because of a xml-declaration, so I moved it down and made it into a comment... That explains it. It isn't doing any harm, it's just redundant and adds confusion as you do have an XML declaration, a real one, on line 1. This dummy XML declaration quotes a different character encoding which make one wonder which character encoding you wished to really use. Your initial post hit the list Thu, 02 Apr 2009 16:30:07 +0300. My reply went out Fri, 10 Apr 2009 08:49:20 +1200. Sorry, I didn't mean to step on any toes. I just meant it's not a problem for me anymore. More like an itch or something, as I don't know why it's not working... Mine wasn't an emotional response. I just pointed out that it hadn't been a week without a reply as you had claimed. I still don't intend to get emotional over it. Which version of IE are you using? Is it in standards mode or quirks mode? You are forcing IE6 and less into quirks mode, which may be intentional. IE7. I'm hoping it is in standards compliant mode. Shouldn't the doctype declaration do that? It should be fine in that respect, i'll have a look at it cross browser, later. You should also look at your pages in IE6 as the real XML declaration does drop this page into quirks mode. Try this if you are on XP. http://tredosoft.com/Multiple_IE URL: http://www.ekebodagis.fi/ekebo/test.html Enough Off Topic, lets get back to your original issue. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] double borders. A different story in IE?
On Wed, 15 Apr 2009 14:44:27 +0300 Came this utterance formulated by Jon Wickström to my mailbox: Fix the errors in your xhtml first. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ekebodagis. fi%2Fekebo%2Ftest.htmlcharset=%28detect+automatically%29doct ype=Inlinegroup=0 Now my example validates cleanly... And yet you have a fake XML declaration in line 9 which does nothing that i can see. Still would validate though. It still behaves the same way though... I have actually moved on. As it took over a week to get the first response to my initial question I assumed nobody cared or had any suggestions. Your initial post hit the list Thu, 02 Apr 2009 16:30:07 +0300. My reply went out Fri, 10 Apr 2009 08:49:20 +1200. I solved it by using an extra DIV to give the look of a double border... See main page http://www.ekebodagis.fi Is there no visual standard for how a double border should look? Any which way, IE seems to do the double border a bit differently from all the other browsers. I'm still a bit curious why the border in IE overflows the UL-element in my example... http://www.ekebodagis.fi/ekebo/test.html Not even looking at it, but can i suggest the box model bug? http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/ Which version of IE are you using? Is it in standards mode or quirks mode? You are forcing IE6 and less into quirks mode, which may be intentional. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OFF TOPIC (webpage size)
On Mon, 13 Apr 2009 20:01:24 -0600 Came this utterance formulated by Brian Hazelton to my mailbox: Just out of curiosity, if i had a page with a width of 768px total, and the rest is a subtle bg, would that be too small of a width? For a phone that can view 400px wide or a 2400px wide monitor? Perhaps you should consider a flexible width, not a fixed pixel width. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] double borders. A different story in IE?
On Thu, 09 Apr 2009 23:44:04 -0700 Came this utterance formulated by Divya Manian to my mailbox: On 4/9/09 1:37 PM, Michael Adams linux_m...@paradise.net.nz wrote: Divya - I disagree. IE7 handles the XML declaration fine in standards mode[1]. Although i see it on line 8 when it should always be on line 1. IMHO IE less than IE7 should always be in quirks mode and the XML declaration will achieve this. Jon - I am on linux here at home so no IE running. Will look at it at work later today but you may already have an answer by then. [1] http://blogs.msdn.com/ie/archive/2005/09/15/467901.aspx I think this bug is still triggered in IE 6[1], but I didn't realise the question was asked for IE 7. Sorry about that. [1] http://www.quirksmode.org/css/quirksmode.html My point was that I don't see quirks mode as a bug. I find it useful and actively force IE5 - IE6 into it. That way they behave more consistently. I see the XML declaration as the cleanest way to force quirks mode. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] page-break-inside:avoid; not working
On Fri, 10 Apr 2009 16:43:27 -0400
Came this utterance formulated by Yvan Daneault to my mailbox:
I am a web-design teacher who's in the process of putting his
documentation online, but I also want my students to occasionnally
print the pages. The situation is as follows:
I do not want paragraphs to be broken by a page break.
I have include the following rule in my stylesheet:
p {page-break-inside:avoid;}
but it does not seem to work in most browsers, except Opera. I love
Opera but my students are not using it. Most of my base is on Safari
3.0 Mac which claims that Safari has been supporting page-break-inside
since version 1.3.
Opera is the only one with this support AFAIK:
http://reference.sitepoint.com/css/page-break-inside#compatibilitysection
If you are teaching web design you should be telling students to look at
their work in as many different browsers as possible. You can then
advise them that Opera has the best support for printing. To me it
doesn't matter as i normally copy and paste to a word processor before
printing anyway, even on print ready sites, to avoid two lines on a page
if i can.
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] double borders. A different story in IE?
On Thu, 09 Apr 2009 07:16:29 -0700 Came this utterance formulated by Divya Manian to my mailbox: On 4/2/09 6:30 AM, Jon Wickström jon.wickst...@arrak.fi wrote: The look I'm after is a double border with the inner border the same color as the parent bg, and the outer the element bg. This I get in all sane browsers by specifying the parent bg as the border color and the border styledouble. This gives me a separated border with the element bg color. In the example I use red, not the parent backgroundborder color, to see the border clearly. The green border is just for your viewing pleasure. It is a div used for markup to center the menu. If anybody has a cleaner centering-solution, I'd bee happy to look at it. For a test-case see: http://www.ekebodagis.fi/ekebo/test.html IE is rendering your page in quirks mode because of the xml namespace declaration on top. Remove that and serve the page as content type text/html or use HTML 4 Strict if necessary. Divya - I disagree. IE7 handles the XML declaration fine in standards mode[1]. Although i see it on line 8 when it should always be on line 1. IMHO IE less than IE7 should always be in quirks mode and the XML declaration will achieve this. Jon - I am on linux here at home so no IE running. Will look at it at work later today but you may already have an answer by then. [1] http://blogs.msdn.com/ie/archive/2005/09/15/467901.aspx -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] double borders. A different story in IE?
On Thu, 02 Apr 2009 16:30:07 +0300 Came this utterance formulated by Jon Wickström to my mailbox: Hi, I'm trying to style a horizontal menu with double borders on the active LI menu item. There is some use of nested floating, as I want to use blocks for the LI to get them an even width. IE (7, haven't even tried 6) just gets it plain wrong (from my point of view). The double border seems to work differently in IE compared to all other browsers I've tried (FF, Opera, Chrome). IE renders the middle line in a double border transparent. All other browsers use the elements bg-color. IE also shows som strange stuff with the alignment. The borders overlap the parent elements borders. Some kind of collapsing borders in IE?!?! Is this really the case or is my CSS/HTML just broken in IE? One huch I have is that IE is using it's own box model, not the standard compliant? I vaguely remember something about IE not including the borders inside the box. The look I'm after is a double border with the inner border the same color as the parent bg, and the outer the element bg. This I get in all sane browsers by specifying the parent bg as the border color and the border style double. This gives me a separated border with the element bg color. In the example I use red, not the parent backgroundborder color, to see the border clearly. The green border is just for your viewing pleasure. It is a div used for markup to center the menu. If anybody has a cleaner centering-solution, I'd bee happy to look at it. For a test-case see: http://www.ekebodagis.fi/ekebo/test.html Fix the errors in your xhtml first. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ekebodagis.fi%2Fekebo%2Ftest.htmlcharset=%28detect+automatically%29doctype=Inlinegroup=0 -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] EMs vs. PERCENTs
On Thu, 19 Mar 2009 09:03:15 -0700 Came this utterance formulated by Kenny Leu to my mailbox: D'oh! I should've read that link above before posting... To redeem myself: EM: - always relative to font size - fonts affect absolute widths of things set with EM! (e.g. could cause horizontal scroll) - however, relative widths are not affected. e.g. if a particular sentence fits all on one line, it will always fit on one line even if the font is changed to be very large. But this is dependant on at least one other factor. Fonts on the user computers, different fonts have different letter widths. So the sentence width may vary with regard to a set EM container width. PERCENT: - always relative to containing block (could be parent font as well) - this means that containing blocks can get very crowded. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] EMs vs. PERCENTs
On Thu, 19 Mar 2009 17:28:08 + (GMT)
Came this utterance formulated by Bobby Jack to my mailbox:
--- On Thu, 3/19/09, Michael Stevens bigm...@bigmikes.org wrote:
So, is it uncommon, or bad practice, to use both in this
situation?
{height: 7.2em; width: 20%;}
More and more, I find myself using the two in various combinations. It
gets particularly interesting if you throw pixels into the mix (which
*can* still have valid uses!) and/or combine different measurements
with, for example, width, min-width, and max-width.
Generally speaking, I think the following are relevant points:
1. Line lengths are less legible if they are too short or too long;
this suggests some level of box-sizing related to font-size, i.e. ems.
2. That's not to say the line length cannot vary; min-width and
max-width in ems can still achieve readable copy with varying font
sizes.
3. Horizontal scrolling is BAD. Unrestricted em-sizing tends to lead
to horizontal scrolling, but this can be mitigated (esp. on the good
browsers) with max-width as a percentatge - e.g. 100%
4. Users with v. wide screen resolutions might like to take advantage
of the fact. This suggests some level of percentage-based box sizing
(for width).
I use ems for widths to try to work to readable line lengths.
Recommended line lengths generally vary from 40 - 75 letters depending
on whom you are reading:
http://desktoppub.about.com/cs/typelayout/a/linelength.htm
http://blog.anthonyjones.biz/2009/01/typography-101-line-length/
http://artsci.wustl.edu/~gssw/2004/dw/typography.htm
5. Equally, users with narrow resolutions are increasingly common -
mobile phones, handheld games consoles, pdas, etc. It would be wise to
ensure your content is at least readable by them, so large fixed
widths may not be the best long-term strategy.
I do use percentages for maximum widths when i consider the browser
may be anything from a phone to a very wide screen. I have also used a
pixel maximum width of around 1250 for the site design width. To cater
to IE7 (without maxwidth support) i generally supply a fixed width on
the wrapper div, in a seperate style sheet which works for 800px
screens unless i know the customer is on 1024px throughout - in this
case IE7 users on 800px screens scroll the menu bar out of view (bad,
yes, but these IE users are in the under 10% minority).
I think 'combined measure' layouts are the way of the future; georg (I
/think/ - apologies if someone else!) discussed these at great length
in an excellent mail the other day. Em layouts have fallen out of
favour recently with the introduction of page zooming, especially
given that percentage-based layouts tend to behave 'nicely' with this
technique (i.e. NOT causing horizontal scrollbars in good browser
implementations). I don't think 'unrestricted' percentage-based
layouts are the end of the story, though.
I tend to turn text only zoom on before zooming and i personally use
zoom on a lot of sites where i want to read.
I'm currently experimenting with a (much improved) layout for my
site's home page which will combine some of these concepts to produce
a layout that scales nicely with font size, adapts to browser width
appropriately, and gives everyone 'screen estate' value for money.
More on http://www.fiveminuteargument.com very soon.
- Bobby
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] EMs vs. PERCENTs
Ignoring later posts and replying inline. On Thu, 19 Mar 2009 18:52:22 -0400 Came this utterance formulated by Theophan Dort to my mailbox: i generally supply a fixed width on the wrapper div, in a seperate style sheet which works for 800px screens How do you serve different CSS to different people? I'm assuming some sort of JavaScript sniffer? I use the @import hack that i first learned about here: http://annevankesteren.nl/2005/10/ie-import-hack Georg also uses it, which puts me in good company ;) http://www.gunlaug.no/contents/wd_additions_12.html I love your Julian of Norwich quote, BTW. Did you ever read her book _Showings_? Really weird, but fascinating, and wonderful in places. No -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Font size dilemma
On Mon, 16 Mar 2009 02:19:42 -0400 Came this utterance formulated by Felix Miata to my mailbox: On 2009/03/16 14:41 (GMT+0900) Philippe Wittenbergh composed: Felix Miata wrote: I haven't figured out where Vrinda came from, other than it's a M$ font NAICT originally from mid-2004. Vrinda is part of a default install of Windows XP (I wouldn't know how it got installed on my VM's otherwise). As I haven't been able to find a copy dated older than mid-2004, I don't believe it could have been part of an original XP install, nor a SP1 install. I keep copies of the oldest known versions of most M$ fonts just for answering questions like this. I think Vrinda may be part of SP2 originally. Correct http://www.wazu.jp/gallery/Fonts_Bengali.html -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Font size dilemma
On Sat, 14 Mar 2009 18:42:06 -1000 Came this utterance formulated by david to my mailbox: Jukka K. Korpela wrote: Michael Stevens wrote: Calibri I have but do not have installed all the time and use it maybe a couple times a month. And I've never heard of Vrinda. I picked up Vrinda after considering the material at http://www.codestyle.org/css/font-family/sampler-WindowsResults.shtml and noticing that Vrinda is the only widely available sans-serif font where letters are small as compared with the font size. So it's the best backup for Calibri, the font I'd really like to use. As you can see from http://www.ascenderfonts.com/font/vrinda-bengali.aspx Vrinda was really designed for Bengali writing, but it has Latin 1 characters too, so it might serve as a fallback font when you don't need other characters. I guess the Bengali orientation explains the large intrinsic line-height. Well, in my 20+ years of using computers, including desktop publishing, graphic and web design work - I've never used a computer that had either Calibri or Vrinda on it. And I used to be a real font junky! (That spans every version of Windows, Mac OS7/8/9 and OS X, one version of UNIX and several distros of Linux.) Calibri is one of a set of Office 2007 fonts which can be obtained free with the new powerpoint viewer. http://www.microsoft.com/downloads/details.aspx?familyid=048DC840-14E1-467D-8DCA-19D2A8FD7485displaylang=en http://en.wikipedia.org/wiki/Calibri It's use is expected to grow as uptake of office 2007, and this free viewer, gets established. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Size calculations
On Sun, 15 Mar 2009 21:12:39 +0100 Came this utterance formulated by Gunlaug Sørtun to my mailbox: Ib Jensen wrote: That means roughly, that a developer should have at least three screens with different resolutions and X number of browsers installed, on different systems, to in fact have a chance to guess which size of units to use. Not at all. You can check all conditions on a screen with high enough resolution, but you may have to keep track of those browsers and how they evolve and respond to changes on the hardware side. The reason I opted for such a large screen-area on my workstation, is that I can simulate nearly all hardware/software induced conditions on it through a few clicks. Most web designers can simulate parts of modified conditions at the user-end by zooming up and down the entire page in a capable browser. First: get the terms, and sizes, right. Resolution is somewhere between 72 and 300dpi and most viewports/screens are between 640 and 3600px wide. Phone and palm browsing is on the increase and screen width there is typically under 400px. Resolution vs pixel-width affect actual screen size, so a 2400px wide screen with 220dpi resolution (not many of those around, but they're coming) will be physically quite small in size. So, forget about 15, 17, 19 and so on for screens. A screen is so and so many screen-pixels wide and tall, regardless of its actual size. This resolution vs. size range can not be covered by web designers by using one size fits all methods - the browsers and end-user settings have to bridge the gap. What we have to do is to allow browsers to do their job - we have to work _with_ the media and not against them, and only decide which limits we have to set so our creations have a chance to survive. The only somewhat safe way to lay out web pages so they work everywhere, is to not lock sizes to anything but viewport - using percentage, and decide what is too wide or too narrow for our creations. 'em' is locked to font-size, so 'em' is in most cases only useful for setting limits - min-width and/or max-width, and those limits should be quite generous. 'px' is also locked, so they're also most useful for setting generous limits. In time browsers and other software will be modified to un-lock both 'em' and 'px' - in a way, in order to make sensible use of higher resolution on screens. Full page zoom is one way to do that, and most browsers already have the basics (for manual setting) in place. Screen-pixels and design-pixels then become relative to each other - as they already are on regular printers, and the software will do the conversion (see wishful thinking in another thread today). For full page zoom browsers seem to go the adaptive zoom route, probably because they can't cover the wide resolution/actual screen size range any other way and make it fit on screen for all end-users. Most fluid-width designs will then work quite well without modifications, but both 'em' sized and 'px' sized designs may run into range problems since they can't really adapt to viewports/screens unless browsers override their fixed width (my browser-preference can already do that). Fixed-width layouts, being it 'px' or 'em', will probably never go out of fashion ... they just won't work very well outside their creators' preferred range. Support for media queries is slowly growing across browser-land, so we are, or will be, able to modify our designs a bit to suit the various conditions. Great care has to be taken here though, as we must know what various browsers actually do under various conditions before we try toimprove things. Now, browsers and screen-resolutions can only go one way, upwards, while screen-sizes can and will go both ways. Thus, the future for rendering on flat screens is predictable, although it is hard to say how quickly they evolve and spread. They have to introduce one or more non-flatscreens for anything to change. So, IMO, it is best *not* to convert a fluid layout into anything else right now, but instead only control the upper and lower limit for its fluidity so it doesn't become ridiculously and/or unusably wide or narrow. That this control of fluidity can be achieved both forward and in reverse, and in a few other ways, may complicate matters for those who haven't grasped the whole adapt or fail concept. However, rising resolution and both larger and smaller screens and various devices are hitting the market around us, so quick learners will be at an advantage. regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [OT] Opera causing images...
On Thu, 26 Feb 2009 20:54:38 -0500 Came this utterance formulated by David McGlone to my mailbox: [snip] Thank you Georg, You hard coded every image, but I stuck with the php. :-) I wasn't about to hard code every picture for that page because, there could be hundreds more in the future. LOL But I did learn a good lesson. That is validation! I need to use it often and I'll start making it a habit. the reason I went with the nbsp; is because I'm not very good at CSS yet and that was the only way I could figure putting some space between the pictures. Blessings, Just a quick aside. The firefox web developer toolbar shows a quick validation test of the current webpage you are looking at. Javascript, CSS and(X)HTML. Not a full replacement for the online tool but useful while developing nevertheless as you'll find yourself making less visits to the w3c validator: https://addons.mozilla.org/en-US/firefox/addon/60 -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] New to List First question.
On Mon, 16 Feb 2009 16:58:25 -0800 Came this utterance fomulated by Ryan Little @ Gusto to my mailbox: Not really sure how relevant browser statistic are regarding the practical application of CSS. Nevertheless, there was a very long thread last month, on somewhat related matters, that may help be of interest to you. It begins here: http://markmail.org/search/?q=the+css+overlords#query:the%20css%20 overlords+page:1+mid:eq3b3ynqjk46m7xs+state:results If the link breaks in transmission, the subject line is: The CSS Overlords Hi David, Thanks for the welcome, sorry If the css got lost in there :) The reason I brought the browsers up in relation to the CSS is because I have to make a CSS file to deal with older browsers if people would just upgrade to current or at least a newer browser than one set of CSS works. (at least so far) IE 7 and 8 are behaving a great deal more than 6 and lower did. To bring it back on track - controlling pages using CSS; i use a well known technique which makes IE5, IE5.5 and IE6 behave very similar to each other. Throw them into quirks mode intentionally, then you only need program for IE6 (unless your customer or one of his major customers use an older browser). The technique is not perfect and i still check across a broader range of browsers with completed pages but IE6 is the lowest i check _during_ development. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can apply style inline but not in style sheet
On Fri, 12 Dec 2008 08:40:56 -0800 Came this utterance fomulated by Angela French to my mailbox: Angela French wrote: Benjamin - I am trying your approach to just style my h2 with a background color. It is definitely get there, but it makes the height of the color block too tall, putting extra padding in below the actual h2 text. Since one can't make negative padding, it seems setting a height to the h2 is the only way to size the color block the way I want. Is this the most appropriate way of getting the block of color to be the size I want? Given you can't ultimately control the size of the H2 text, what size _do_ you want? (i.e. why are you trying to enforce a particular height at all?) -- Benjamin Hawkes-Lewis It isn't a matter of controlling the size of the h2, but of the margin beneath it. The 'line-height' property may be what you need. Set padding and margin to zero. Line height will center on the middle of the font vertically and does not require units be specified. 1 is font height and 1.5 is font height with 0.25 above and 0.25 below. A setting of about 1 or 1.1 may achieve your aim. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 strikes again .....
On Tue, 25 Nov 2008 10:07:03 -0800 Came this utterance fomulated by Ambient Glow to my mailbox: I had a number of CSS issues with IE on this draft page, but, thanks to Gunlaug's help, most of them are worked out. The page is displaying fine for in IE7, but client says it is splitting in two and the navigation is detached in IE 6. http://ambientglow.com/garage/jfogg/sample-home.html CSS: http://ambientglow.com/garage/jfogg/_css/home.css Any idea on fixes? As a developer, if you have a Windows XP box, Multiple IE is really useful for seeing these things. Be warned, some MultipleIE versions do not 'exactly' replicate real world versions. But close is usually better than having your customer report a site as broken. http://tredosoft.com/Multiple_IE It is your new task to try to get your site to work on as many browsers as possible before the customer sees it ;-) -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] http://validator.w3.org can not validate a page
On Sun, 23 Nov 2008 14:23:39 +0100 Came this utterance fomulated by Paul Jung to my mailbox: Hello there, I used http://validator.w3.org to check a page: http://www.europeeurope.net/index.php but it returned with such erroe: Sorry, I am unable to validate this document because on line 454 it contained one or more bytes that I cannot interpret as utf-8 (in other words, the bytes found are not valid values in the specified Character Encoding). Please check both the content of the file and the character encoding indication. The error was: utf8 \xE4 does not map to Unicode Does anybody know anything about that? Thank you! Not a CSS issue. I replied off list. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centre an image
On Sat, 22 Nov 2008 19:08:50 +
Came this utterance fomulated by Peter Bradley to my mailbox:
Ysgrifennodd Estelle Weyl:
Give the parent a width of 100%, then give the image a display of
block and margin auto.
Doesn't seem to work for me.
But adding 'text-align: center to the parent will.
Typically i do this to body to center the whole site in the browser.
Then use 'text-align: left' for relevant content divs. Thus:
#header {
width:100%;
text-align:center;
}
img#logo {
display:block;
margin:auto;
}
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Default % values - newbie question.
On Thu, 06 Nov 2008 12:44:08 +0100 Came this utterance fomulated by Gunlaug Sørtun to my mailbox: [snip] Line-height defaults differ slightly, so it often makes sense to level them with a mid-range value that makes reading easy, and that helps with styling of other in-text elements we may use. [snip] From my learning, i think leading or line height should also vary with the x-height of the preferred font. Verdana, with its huge x-height (0.58), at a line-height of 1.3 can still look crowded to many, yet this is a perfectly acceptable line-height for a font like Times New Roman (0.46). I am not touting the suitability of Times New Roman over Verdana here, merely using them as illustrative. Roll on better browser support for font-size-adjust (and for me a simple linux utility for reading font x-height values from the font, if one exists). -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to get rid of scroll bar?
On Mon, 03 Nov 2008 19:01:19 -0600 Came this utterance fomulated by Peter Hyde-Smith to my mailbox: [snip] IMO, you've got a ton of CSS; maybe want to more distinctly separate basic layout CSS from fiddley-bits. Also, recommend setting font-size in % instead of fixed pixels, for browser friendly resizing. Setting all font sizes in % is not recommended. nested table cells, paragraphs, lists or blockquotes inherit their font size then apply the percent again, so you can get 66% of 66% or 44% as a result. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] The 1 px terror - Help.
On Tue, 04 Nov 2008 15:36:46 + Came this utterance fomulated by MEM to my mailbox: Gunlaug Sørtun Wrote: When you don't declare font-size and/or line-height, all browsers will use their own default values. I see... so it's default BUT we have to give him same values so he can'tdefault by himself. And since there isn't any update list of what properties the browsers use differently by default and what properties they don't use differently by default, it's a good practice to declare all by ourselves. - Please tell me this is correct (or don't) :) This is a philosophical choice. Do i want to control the user experience? versus Do i allow the user to control how they see my website?. The user can overrule practically anything you set anyway, and WCAG recommendations see that as a good thing. http://www.xs4all.nl/~sbpoley/webmatters/fontsize.html http://informationarchitects.jp/100e2r/ May help you see things differently. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to get rid of scroll bar?
On Tue, 04 Nov 2008 15:19:31 -0600
Came this utterance fomulated by Peter Hyde-Smith to my mailbox:
- Original Message -
From: Michael Adams [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, November 04, 2008 12:12 PM
Subject: Re: [css-d] how to get rid of scroll bar?
On Mon, 03 Nov 2008 19:01:19 -0600
Came this utterance fomulated by Peter Hyde-Smith to my mailbox:
[snip]
IMO, you've got a ton of CSS; maybe want to more distinctly
separate basic layout CSS from fiddley-bits. Also, recommend setting
font-size in % instead of fixed pixels, for browser friendly
resizing.
Hence, Michael's erudite response...
Setting all font sizes in % is not recommended. nested table cells,
paragraphs, lists or blockquotes inherit their font size then apply
the percent again, so you can get 66% of 66% or 44% as a result.
Michael:
I should have been more specific. From an accessibilty/usibilty
standpoint this delcaration of Bill's CSS
http://www.shopkeepers-r.us/stylesheets/application.css?1225143428,
body, p, ol, ul, td {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 13px;
line-height: 18px;
}
may be better served in part,
body{font: 100%/1.4 verdana, arial, helvetica, sans-serif;}
with child elements served in ems (or just left alone). I've been down
the road of nested %'s. It's confusing and ugly.
Which is precisely the way that i do it. The only exception i make is
not using Verdana at 100%. The large x-height can make it look ugly at
'normal' sizes, when it was designed to look good at smaller sizes. Of
course this is subjective.
http://www.xs4all.nl/~sbpoley/webmatters/verdana.html
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] i thought styling some quote images around text can be quite simple but how wrong!
On Fri, 24 Oct 2008 00:53:15 -0700 Came this utterance fomulated by liketo findoutwhy to my mailbox: to simply add two quote images around some text. seems quite simple at first but turns out all the obvious solutions are not as desirable as a perfect solution: please see http://www.0011.com/css/quote.html basically, Style 1 is just inlining the image, text, and image. Style 2 is using a table. Style 3 is using images as background. None of them actually is perfect... it seems so easy at first... anyone know a way to make it work at all? thanks. I think the trailing span will work in IE if you do it with display: inline-block;. Untested as i am on my Linux box. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Browser Hacks
On Thu, 09 Oct 2008 11:32:45 +0900 Came this utterance fomulated by Philippe Wittenbergh to my mailbox: Thanks for your worthwhile reply. On Oct 9, 2008, at 10:52 AM, Michael Adams wrote: I have grown so fond of this technique that i have thought of extending both it and @media in a new direction. If browsers were seen as a type of media you could legally write fixes for any CSS issue in a given browser. The technique would only be applied to future browsers as no current browser sees itself as a media type. THis gives CSS authors a way of applying fixes for inaccuracies or disparate CSS interpretations in the future. ... In the future it could look like this: [Quote] @import url(layout.css); @import url(colour.css); @import url(fonts.css); @import url(ie9hacks.css) ie9; @import url(ff4hacks.css) ff4; @import url(safari4hacks.css) safari4; @import url(opera10hacks.css) opera10; [/Quote] Only the relevant media files for a site would need to be included. I am asking for opinions on this idea. It looks like a good idea to me because i already use the technique, so other opinions are vital before i try to give the idea some steam with w3c or browser manufactureres. Some may say that i should be targeting layout engines direct, or versions of Gecko, Trident, Presto or Webkit. That may be the right way to go, but Chrome uses Webkit with proprietary hacks, hence i went by browser name. ... This would also allow SVG to be fed to compliant browsers as background images without programmed or .htaccess hacks. You're probably on the wrong list for this. :-) You should rather submit your ideas to the CSS-WG www-style mailing list [1]. I thought this was a CSS discussion list? There have been various proposals on that subject like [2], [3]. Follow the links to replies, etc. Most implementators have rejected those ideas. Some -some- authors are very much in favour. Personally, as an author, I strongly dislike those ideas, I see that as completely orthogonal to the concept of standards. I was intending to target authors without getting the strong corporate decision style arguments of implementors swaying this discussion. This list is therefore ideal. If those proposals ever see the light of the day, it should definitely be based on rendering engine detection (Gecko, WebKit, Presto,...) , and not vendor (Firefox, Safari, ...) detection. That is a matter of opinion, the links you provide discuss both seperately and jointly. Should there be a Webkit and GWebkit option for Chrome? IIUC Google have applied in house modifications to Webkit. [1] http://lists.w3.org/Archives/Public/www-style/ [2] http://lists.w3.org/Archives/Public/www-style/2008Sep/0219.html [3] http://lists.w3.org/Archives/Public/www-style/2007Oct/0112.html Thanks for those very useful links. A lot of useful discussion taking place. It did not sway me though. This is a take it or leave it kind of rule like @media print. My thought was if you don't like it, you don't need to use it. It seems for CSS anyway a far saner method than IE's current conditional HTML statements (though a direct comparison is apples and oranges). Looking forward to other learned opinions. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Apologies - OT
Sorry folks, just read the Off Topic page David Laakso referred Hedley Finger to and saw the following. http://css-discuss.incutio.com/?page=OffTopic * Some topics are off-topic for css-d, for example:- * mark-up questions * the future direction of CSS * comments on and criticism of the CSS Recommendations * BrowserDetection (aka sniffing) * I consequently won't be persuing this thread anymore. My apologies. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Browser Hacks
On Thu, 09 Oct 2008 14:52:43 +1300 Came this utterance fomulated by Michael Adams to my mailbox: [snip] Sorry folks, just read the Off Topic page David Laakso referred Hedley Finger to and saw the following. http://css-discuss.incutio.com/?page=OffTopic * Some topics are off-topic for css-d, for example:- * mark-up questions * the future direction of CSS * comments on and criticism of the CSS Recommendations * BrowserDetection (aka sniffing) * I consequently won't be persuing this thread anymore (and my previous reply was not attached to the thread). My apologies. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Browser Hacks
On Thu, 09 Oct 2008 12:46:10 +0200 Came this utterance fomulated by Ingo Chao to my mailbox: Thanks for your useful reply The debate about hacking is mostly about hacking IE lte 7. We have sufficient methods to hack IE, though. Because of its market share, we have the knowledge about the bugs, the filtering methods and the workarounds for IE. I don't think we need filtering techniques for current compliant engines like Gecko, WebKit, Opera, and probably IE8. I know they have their bugs too, but for most everyday coding problems, there are interoperable methods available. The differences that these browsers show are the difficulties in interpreting a specification that is still fine-tuning on edge-cases. Now is pretty good yes, but: http://www.andybudd.com/archives/2005/11/common_css_bugs_in_safari_firefox_and_opera/ which is a little out of date but http://www.quirksmode.org/bugreports/index.html Dont forget how hard it is to make a large program 100% error free. http://portal.acm.org/citation.cfm?id=948586 None of us have a crystal ball on the future. Browsers are mostly becoming very compliant now (lack of SVG support in IE is a biggie in my eyes, now that MSFT is going CSS 2.1). But bugs and differences in interpretation will occur, no crystal ball will see by how much. Some developers will take advantage of the current/upcoming browser frenzy to develop bleeding edge CSS. Why deny them a tool which may be usefull. The implementers may start moving ahead of standards with their own features(-moz-opacity). Any static filtering method for these browsers under active development would fail sooner or later, so any hack could suddenly become the problem it should initially solve. Precisely, any hack including the Tan Hack. What i am suggesting is theoretically a controlled standards driven hack. As such it is less likely to become a problem. Anyone working at the levels which necessitate such hacks is also likely to test against browser revisions as they come out to establish when a hack is no longer required. Typically we would be looking at one or two lines of code that need changing per web site per hack. I genuinely doubt that Joe NVuUser is likely to concern himself with CSS (or css-d) unless he is learning and growing in the field. And other filtering methods, on the engine's version level or the spec's version level, would quickly surpass the abilities of web authors in following the latest discussions on the specification, to decide whether a browser is right or wrong. * Download new browser version * View Site * Update CSS if required Pretty much the same process we will all be going through with IE8, and have just gone through with FF3. Standard site maintenance? A layout should tolerate imprecision by the browser, as it should tolerate user settings and needs that differ from the author's settings and needs. The latter is the bigger problem. Agreed; usability, readability, SEO and accessibilty over pretty, tight, inflexible graphic design. This is all good stuff. And no doubt i am going to trip myself up with my own inexperience. But the continued discussion is valuable. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS Browser Hacks
I am currently using the @import browser hack for IE that i first read about here: http://annevankesteren.nl/2005/10/ie-import-hack I have grown so fond of this technique that i have thought of extending both it and @media in a new direction. If browsers were seen as a type of media you could legally write fixes for any CSS issue in a given browser. The technique would only be applied to future browsers as no current browser sees itself as a media type. THis gives CSS authors a way of applying fixes for inaccuracies or disparate CSS interpretations in the future. A main CSS file for on of my sites currently looks like this [Quote] @import url(layout.css); @import url(colour.css); @import url(fonts.css); @import url(.css) all; [/Quote] In the future it could look like this: [Quote] @import url(layout.css); @import url(colour.css); @import url(fonts.css); @import url(ie9hacks.css) ie9; @import url(ff4hacks.css) ff4; @import url(safari4hacks.css) safari4; @import url(opera10hacks.css) opera10; [/Quote] Only the relevant media files for a site would need to be included. I am asking for opinions on this idea. It looks like a good idea to me because i already use the technique, so other opinions are vital before i try to give the idea some steam with w3c or browser manufactureres. Some may say that i should be targeting layout engines direct, or versions of Gecko, Trident, Presto or Webkit. That may be the right way to go, but Chrome uses Webkit with proprietary hacks, hence i went by browser name. With regards to multiple http requests, don't forget GZip which should already be under consideration on large sites anyway: http://forumdeli.com/2-how-to-serve-pre-compressed-css-js-and-other-web-content/ With Microsoft making a serious attempt to conform to CSS standards (now), the need is reduced but there are still CSS bugs in browsers as well as diferent interpretations within the specs themselves among browser manufacturers. Also different browsers can conform to different versions of the spec. This would also allow SVG to be fed to compliant browsers as background images without programmed or .htaccess hacks. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] block box alignment
On Wed, 17 Sep 2008 15:31:31 +0800 Came this utterance fomulated by ray to my mailbox: Hi, If I set a width for a block box within a containing block, for example 30%, the block box will be aligned with the left edge of the containing block. Is it possible to align it with the right edge of the containing block, without the use of float? div style=border:2px solid red; div style=width:30%;height:200px;background:AntiqueWhite; block box /div /div Maybe a silly question, Could somebody tell me? Thanks in advance. In your outer div add text-align: right; In your inner div you may need to add auto left and right margins margin: 0 auto; If you have other content in the outer div you may need a mid div with the text-align and width of 100%. Why was float not an option? -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Safari Page Break below header
On Fri, 12 Sep 2008 10:46:36 +1200 Karl Hardisty increased personal carbon footprint by exciting electrons the world over with these memorable words: Does anyone else have the page break below the header, and dance from left to right in Safari when reloading? Something I've not seen before. If it's not just me I'll send the person responsible an email. You are likely only to get half of the people on this mailing list pay any attention to your issue. The reason is that they will have the list emails threaded and will no longer be observing this thread as it is of no interest to them. On a mailing list best practise is to start a new thread (by not replying to an existing email) for every new topic. Tacking your question right on the bottom of an off topic branch of the thread reduces your chances further. Not changing the Subject of the email reduces your chances further still. I have done this for you in the hope that it may increase the number of responses to your question but your best move is to still re-ask your question on a new email to the list. Please note also that on many lists it is considered rude to hijack a thread in this way, and other people will not answer hijacks on principle, for the above reasons. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [Slightly OT] Font sizes
On Thu, 11 Sep 2008 17:13:45 -0400 Felix Miata increased personal carbon footprint by exciting electrons the world over with these memorable words: On 2008/09/12 08:41 (GMT+1200) Michael Adams composed: On Wed, 10 Sep 2008 17:12:01 -0400 David Laakso increased personal carbon footprint by exciting electrons the world over with these memorable words: Michael Adams wrote: Does anyone have a good article, and/or a reference to WCAG, that i can use to support the idea that default text size should not be less than the browser default. A Dao of Web Design http://www.alistapart.com/articles/dao Not sure i can use this one as a reference. It is designed for us to read and learn from. Plus it does not conform to 100% body text size. Would be good if its CSS was consistent with its message. 100e2r http://informationarchitects.jp/100e2r/ This is great and has many worthwhile comments I thought so too when it was first published, but it later changed its site styles and no longer practices what it preaches. Several weeks ago I started a rewrite of it that isn't finished and may never be. http://fm.no-ip.com/auth/tmp/new100e2r.html You might want to look through the following, where you might find a link to something appropriate to those artists but doesn't use mousetype to convey an inconsistent message: http://fm.no-ip.com/auth/wauth2.html http://fm.no-ip.com/auth/wauth1.html http://fm.no-ip.com/auth/refmarks.html Among them, http://tobyinkster.co.uk/article/web-fonts/ is my recent favorite, while http://www.w3.org/QA/Tips/font-size ought to be more authoritative, and http://www.lighthouse.org/accessibility/top-10/ arguably a good business approach. http://cssliquid.com/ might be something to point those with an artistic priority to. These are great and may take me a day or two to work through. I have in this last week come across the idea that the last word on web site design perhaps should be given to the typographer, not the graphics designer. This is probably a concept that you CSS Gurus are familiar with, but it is new to me. It may also be one that i was unknowingly using given that my websites are mainly using WCAG techniques within the markup and CSS (the issue i am raising here is an accessibility one of setting body font at 100% with all other font settings in Ems). It is the graphics designer in us all that want's to reduce the font size because we feel it makes the page look tidier. So the secret now becomes designing the best looking website we can around the 100% font content, which ends up being an exciting challenge in itself. I may post a case study of the reasoning behind the website i am working on as an example as this is what i am writing for the client. Thankfully Eric has allowed this thread to continue to date, it does involve CSS design principles, i hope many CSS designers are gaining something from it. But i do expect it to dry up naturally soon, so please bear with us or ignore the thread if you are not interested. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [Slightly OT] Font sizes
On Wed, 10 Sep 2008 17:12:01 -0400 David Laakso increased personal carbon footprint by exciting electrons the world over with these memorable words: Michael Adams wrote: Does anyone have a good article, and/or a reference to WCAG, that i can use to support the idea that default text size should not be less than the browser default. A Dao of Web Design http://www.alistapart.com/articles/dao Not sure i can use this one as a reference. It is designed for us to read and learn from. Plus it does not conform to 100% body text size. 100e2r http://informationarchitects.jp/100e2r/ This is great and has many worthwhile comments PS Slightly OT: I'd have a good answer ready should any these artists visit your signature link source document and its style sheet. Huh? I don't have a link in my signature. This one has gone over my head i think. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [Slightly OT] Font sizes
On Wed, 10 Sep 2008 17:12:01 -0400 David Laakso increased personal carbon footprint by exciting electrons the world over with these memorable words: Michael Adams wrote: Does anyone have a good article, and/or a reference to WCAG, that i can use to support the idea that default text size should not be less than the browser default. A Dao of Web Design http://www.alistapart.com/articles/dao 100e2r http://informationarchitects.jp/100e2r/ PS Slightly OT: I'd have a good answer ready should any these artists visit your signature link source document and its style sheet. It also matters what i have been searching on. I had been searching things like accessibility font without a lot of useful success. I googled on wcag accessibility and got some worthwhile hits: http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/wcag-guidelines-20.shtml http://www.webstandards.org/2007/06/11/review-wcag2-may2007-working-draft/ I also googled WCAG readability, these results yeilded some good hits for my personal use and more importantly to pass on to content creators. http://juicystudio.com/services/readability.php http://www.usability.com.au/resources/wcag2/ -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [Slightly OT] Font sizes
Does anyone have a good article, and/or a reference to WCAG, that i can use to support the idea that default text size should not be less than the browser default. An article that at the same time discusses font units would be acceptable but less desirable. This is to present to artists, for them good looks overrule other design elements. One of the most consistent things that they see consciously or not is that font size looks uglier at default browser sizes. I intend to present the reasons for my viewpoint to provide balance to the discussion. The website is a disability service website. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Lightweight HTTP server for beginner's http://localhost/ ?
On Sat, 06 Sep 2008 01:58:49 -0400 Jerod Venema increased personal carbon footprint by exciting electrons the world over with these memorable words: I'd also recommend checking out some from this list: http://en.wikipedia.org/wiki/Tiny_web_servers Lighty http://www.lighttpd.net/ and nginx http://nginx.net/ have both been getting good press recently. http://news.netcraft.com/archives/web_server_survey.html -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] layout robustness
Using negative margins and fluid layout in a CMS template and just wondering how others handle robustness issues. If one of the authors places a large image in content which looks good on their browser, but it is to big for 800x600 how do you handle the overflow. At present if i use overflow: hidden; the content div text above and below the image gets hidden as well; if i use overflow: none; the content div steps behind the sidemenu div. Education is my main answer, but is there a general css solution? -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] layout robustness
On Sat, 09 Aug 2008 17:34:48 -0400 David Laakso wrote: Michael Adams wrote: Using negative margins and fluid layout in a CMS template and just wondering how others handle robustness issues. If one of the authors places a large image in content which looks good on their browser, but it is to big for 800x600 how do you handle the overflow. I suppose the obvious is that you can't cram 5lbs of apples in a 3lb bag. CMS authors need to be aware of layout limitation regardless of the layout structure that has been employed. The width of the any image, or fixed width element, needs to be less wide than the column it is placed in when the browser is at 800. Tight tolerance is good to avoid. IE6 and down need even /more/ horizontal playroom or the float will drop. A user with a sidebar in use complicates matters. Setting min/max with the min-width at less than enough to clear the scroll bar at 800t helps (you'll need a min/max workaround for IE/6). There are a couple of ways to handle too wide images in narrow windows but I am not sure how well this will work for you in IE, particularly when the width and height of the image is unknown. For IE7 i cheated with fixed width (remembering the words on the cover of Mike Oldfields Tubular Bells album). OT - As for authors, one assured me she was already a CMS site manager with lots of experience, so i promoted her, she then promptly loaded two 24bit 470x350px bmp images onto the homepage content at 350kB+ each. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] layout robustness
On Sat, 09 Aug 2008 17:26:34 -0700 Thierry Koblentz wrote: -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] discuss.org] On Behalf Of Michael Adams Sent: Saturday, August 09, 2008 12:28 PM To: css-d@lists.css-discuss.org Subject: [css-d] layout robustness Using negative margins and fluid layout in a CMS template and just wondering how others handle robustness issues. If one of the authors places a large image in content which looks good on their browser, but it is to big for 800x600 how do you handle the overflow. You could use CSS to set a max-width on the image. Another approach that we used for a specific app is to burn rather large images and then set their width in percentage. That way the width of the parent container is never an issue. Both are valid approaches but both risk huge image download times on dial-up unless i hack the CMS to use imageMagick or similar to resize on upload. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check please...
On Tue, 03 Jun 2008 12:22:49 -0700 (PDT) Raven Gildea wrote: Hi all, May I request a site check please? It all looks okay on my own Mac and PC browsers, but I'd like to hear of any weirdness you might see that I don't: http://www.sweetlorrainebakeshop.com/ Thanks very much! Lorraine Hi Lorraine: I'm seeing two small issues in IE5/Mac. On the home page, I'm getting little square blocks in front of the apostrophes in I've and don't in the lower righthand column. Source in IE5/Mac shows this: pThese are the BEST cupcakes I?'ve ever had.br / pI don'?t want any other chocolate chip cookies after having yours.br / while source in Safari shows I've and don't without the question marks. I don't know why. Anyone? Also in Mozilla on Linux. I originally thought it was UTF-8 chars in a non UTF-8 page. But both your HTTP header and page Content-Type declare UTF-8. The validator spits on these \xA9 characters as well. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.sweetlorrainebakeshop.com%2Fcharset=%28detect+automatically%29doctype=Inlinegroup=0ss=1verbose=1 -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Abstracting CSS from HTML for Reusable UI Components
On Sat, 03 May 2008 15:01:39 -0400
Michael B Allen wrote:
Hi,
I'm exploring the idea of using modules of code to emitting reusable
HTML UI elements like postal addresses, login forms, linked images
and in turn more sophisticated elements such as invoices, forum posts,
etc. Because these elements are supposed to be reusable I do not want
to force style information on the user and yet I need to maximize the
ease with which the user can apply their own style to each element.
For example, let's say one of these classes emits some HTML like the
following:
table
trtd colspan=2h3Account Information/h3/td/tr
trtdUsername:/tdtdabaker/td/tr
trtdEmail Address:/tdtd[EMAIL PROTECTED]/td/tr
trtdFull Name:/tdtdabaker/td/tr
/table
Now let's say I want to change the style of h3 and the field labels
but within this table only. This is basically impossible through CSS
alone.
It's quite possible like so:
#tableid h3 {
color: blue /* Unique styles here */
}
#tableid label {
color: green /* Unique styles here */
}
table
trtd colspan=2h3Account Information/h3/td/tr
trtdlabelUsername:/label/tdtdabaker/td/tr
trtdlabelEmail Address:/label/td
td[EMAIL PROTECTED]/td
/trtrtdlabelFull Name:/label/td
tdabaker/td
/tr/table
But the same code is much cleaner without the table
div id=accountinfo
h3Account Information/h3
labelUsername:/labelabakerbr
labelEmail Address:/label[EMAIL PROTECTED]br
labelFull Name:/labelabaker
/div
Really i shouldn't be promoting label use here as label is for form
labels. We should instead use a definition list as it is appropriate.
The enclosing div is then redundant.
h3 id=accountAccount Information/h3
dl id=info
dtUsername:/dtddabaker/dd
dtEmail Address:/dtdd[EMAIL PROTECTED]/dd
dtFull Name:/dtddabaker/dd
/dl
One possibility would be to allow the user to supply a class name that
will be strategically set on some elements like:
div class=myapp
table
trtd colspan=2h3Account Information/h3/td/tr
trtd class=fieldlabelUsername:/tdtdabaker/td/tr
Then the user can supply their own CSS like:
div.myapp h3 {
color: #80;
border-bottom: 2px #808080 solid;
margin-bottom: 0px;
}
div.myapp td.fieldlabel {
text-align: right;
white-space: nowrap;
}
This seems a little clumsy to me but it's the best I can come up with.
Using the above method you can get more specific with id's, allowing CSS
to be fully implemented, and as garish, as needed.
h3 id=accAccount Information/h3
dl id=inf
dt id=infuserUsername:/dt
dd id=infouserabaker/dd
dt id=infemailEmail Address:/dt
dd id=infoemail[EMAIL PROTECTED]/dd
dt id=infnameFull Name:/dt
dd id=infonameabaker/dd/dl
/dl
Full examples with CSS here:
http://www.comptutor.org/mytest/DefinedStyles.htm
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Abstracting CSS from HTML for Reusable UI Components
On Sun, 04 May 2008 12:48:57 +1200
Michael Adams wrote:
Errata inline
On Sat, 03 May 2008 15:01:39 -0400
Michael B Allen wrote:
Hi,
I'm exploring the idea of using modules of code to emitting reusable
HTML UI elements like postal addresses, login forms, linked images
and in turn more sophisticated elements such as invoices, forum
posts, etc. Because these elements are supposed to be reusable I do
not want to force style information on the user and yet I need to
maximize the ease with which the user can apply their own style to
each element.
For example, let's say one of these classes emits some HTML like the
following:
table
trtd colspan=2h3Account Information/h3/td/tr
trtdUsername:/tdtdabaker/td/tr
trtdEmail Address:/tdtd[EMAIL PROTECTED]/td/tr
trtdFull Name:/tdtdabaker/td/tr
/table
Now let's say I want to change the style of h3 and the field labels
but within this table only. This is basically impossible through CSS
alone.
It's quite possible like so:
#tableid h3 {
color: blue /* Unique styles here */
}
#tableid label {
color: green /* Unique styles here */
}
table
the above line should read
table id=tableid
My example page does have it correct.
trtd colspan=2h3Account Information/h3/td/tr
trtdlabelUsername:/label/tdtdabaker/td/tr
trtdlabelEmail Address:/label/td
td[EMAIL PROTECTED]/td
/trtrtdlabelFull Name:/label/td
tdabaker/td
/tr/table
[snip]
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Abstracting CSS from HTML for Reusable UI Components
On Sat, 03 May 2008 21:07:53 -0400 Michael B Allen wrote: On Sat, May 3, 2008 at 8:48 PM, Michael Adams [EMAIL PROTECTED] wrote: But the same code is much cleaner without the table Ahh, I knew that was coming. I've tried creating forms without tables but I could never get the data to line up into ... well ... a table. And AFAICT your examples don't either. Did you look at the linked example page? I gave four examples in my reply. Three do not use tables. Under the last i gave a link to the working example page. I have used CSS not included in my reply to make the code work, and look better than the table, while being as text-scalable as possible. I'll repeat the example page link here: http://www.comptutor.org/mytest/DefinedStyles.htm All the CSS is in the head. I haven't tested it extensively for looks but it did validate and uses standards compliant CSS. So it should need minimal hacking for various browser issues. I am on a linux box at home so don't have IE available for testing. If anyone want to check on IE for Mike and add any relevant hacks, please do. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How do you feed IE versions different css than w3c compliant browsers?
On Wed, 16 Apr 2008 00:27:20 +0200 Manfred Staudinger wrote: On 15/04/2008, Bill Brown [EMAIL PROTECTED] wrote: You can use this syntax to target all NON-MSIE browsers: !--[if !IE] -- style type=text/css@import url(css/fix/non_msie.css);/style !-- ![endif]-- Thats definitely an unnecessary hack. The correct (although proprietary) syntax would be: !--[if IE]![if !IE]![endif]-- style type=text/css css here /style !--[if IE]![endif]![endif]-- I find these both particularly ugly and use the '@import hack' instead. Just a normal line in the HTML and the real hack in the CSS code itself. After all it is the presentation, design or functionality that is the issue, *not the content*. This is all i have in the (X)HTML link rel=stylesheet href=master.css type=text/css / But heres the CSS master file /* ** master.css ** */ @import url(layout.css); @import url(colour.css); @import url(fonts.css); @import url(.css) all; /* */ That's it; the trick is in that final line. IE loads a file called url(.css) all and all other browsers load a file called .css. It relies on a bug in IE. I usually have very few hacks in the .css file compared to the url(.css) all file. I first read about this hack here: http://annevankesteren.nl/2005/10/ie-import-hack A full range of @import hacks and browsers affected are here: http://imfo.ru/csstest/css_hacks/import.php But my requirements are not that specific. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Font Sizes
On Tue, 08 Apr 2008 18:43:14 -0500 Alan Gutierrez wrote: I'm noticing that when I specify font sizes using em, they are slightly smaller in Firefox than in Safari. This becomes a problem when the font sizes get smaller. In Safari they are the right size, but in Firefox they are almost illegible. I couldn't dig anything up on Google, probably searching with the wrong terms. Could anyone point me to a discussion of or article on this particular quirk? In theory this is part of the users right to control how large the font is they are viewing themselves[1]. In practise this is not often reality as most users are not aware they can control the default browser font size. To a web developer the optimum for accessibility is to not use a font under 1em. In practise space in areas like sidebars can force many developers to set a pixel font size[2]. What i try to do is specify my fonts in ems and check that degredation is ok in IE at Largest font setting and in Firefox for at least 3 Larger settings (found in the view menu of both browsers) before becoming unreadable. Trying to have too fine-grained control over fonts is a hangover many print designers persist in hanging on to. Designing for the internet is a compromise on many fronts. One last thing you may wish to take into account is that different monitors use different DPI[3] or PPI[4] settings. What may look good on your LCD monitor may not look as good on an 800X600 15 CRT monitor, These references (below) are less authoritative than illustrative, but among them you will probably find the compromise that suits your demonstration page. Zen Garden designers before you have employed various methods to constrain fonts on their pages, many examples may be found in the CSS there. Because it is demonstrative one should consider if the techniques used there are techniques that should be employed in practical sites, which also perhaps gives you permission to use more fixed methods there as it is for demonstration purposes. [1] http://kb.iu.edu/data/aiwf.html [2] http://www.netmechanic.com/news/vol2/html_no11.htm [3] http://en.wikipedia.org/wiki/Dots_per_inch [4] http://en.wikipedia.org/wiki/Pixels_per_inch -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Help with the C in CSS
On Mon, 07 Apr 2008 23:21:26 +0200 Ingo Chao wrote: Michael Adams wrote: ... Then you have four factors involved which should be taken into account in the following order: weight, origin, specificity, sort order. But you didn't ask about them CSS 2.1:6.4.1 -4 says: if two declarations have the same weight, origin and specificity, the latter specified wins. This sounds clear, but ... what exactly is meant by weight? CSS 2.1:6.4 says: The CSS cascade assigns a weight to each style rule. When several rules apply, the one with the greatest weight takes precedence. By default, rules in author style sheets have more weight than rules in user style sheets. Precedence is reversed, however, for !important rules. Is weight a result of importance and origin? To date the only thing i am aware of that truly adds weight is !important and even that can be ignored in some browsers and overruled by a User Style. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Most popular fonts for browsers
On Tue, 08 Apr 2008 15:09:51 +0200 Cristian Palmas wrote: Hi All, I'm creating a CSS layout for my personal website, divided into six subdomains, that each has its own layout. In literature section I want to use a banner with a particular typeface that reminds the act of writing (Mistral, Lucida Sans and so on). Anyway, since I don't want to create images to take place on the h2, h3, h4 tags, I was thinking about a good font to use both for the banner and for the literature subdomain titles. Every browser can show the true type fonts installed on their machine: if I don't have Comic Sans MS installed, my browser can't show it. So I was looking for most popular fonts in order to choose one that fits my visual layout intentions but which is commonly used by users. Does anybody know about a list of commonly used fonts? Thanks. http://www.codestyle.org/css/font-family/sampler-CombinedResults.shtml -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE bug with background images on multi-line inline links
On Sun, 06 Apr 2008 21:46:10 -0700 (PDT) Adi Palazova wrote: I know that many people don_t like justified text on web sites. I will be very grateful for more opinions about this. It spoils readability. If you are reading late at night and read the same line of text three times you know you are getting tired. Justified text, especially on long lines increases the risk of repeating lines. Not sure how the right end helps you find the left end starting point - but i am assured it does. http://www.google.com/search?q=Justified+text+readability -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE bug with background images on multi-line inline links
On Mon, 07 Apr 2008 20:20:55 +1200 Michael Adams wrote: On Sun, 06 Apr 2008 21:46:10 -0700 (PDT) Adi Palazova wrote: I know that many people don_t like justified text on web sites. I will be very grateful for more opinions about this. It spoils readability. If you are reading late at night and read the same line of text three times you know you are getting tired. Justified text, especially on long lines increases the risk of repeating lines. Not sure how the right end helps you find the left end starting point - but i am assured it does. http://www.google.com/search?q=Justified+text+readability In particular this compares columns and justified text: http://psychology.wichita.edu/surl/usabilitynews/72/columns.htm -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Help with the C in CSS
On Mon, 07 Apr 2008 12:13:52 -0700 John wrote: I have been using CSS for a couple years now, but most of what I've done is emulate code I've seen and bang it into the form I need it to be. Any suggestions on a spot on line with a good explanation of the cascading relationship(s)? A cascade is a series of waterfalls. In each CSS step (or waterfall) rules can be set. If there is a clash between a rule at the top and an equivalent rule in a later stylesheet, or even later in the same stylesheet, the latter one wins. Thats the basis. Then you have four factors involved which should be taken into account in the following order: weight, origin, specificity, sort order. But you didn't ask about them -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Bullet list without paragraph break
On Sun, 06 Apr 2008 15:33:49 +0100 Andrew Doades wrote: remove the ul from start and end! This will give you just the bullet points! [snip] But will not be valid code. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] hr / styling
On Sat, 05 Apr 2008 22:49:26 +0100 Alan K Baker wrote: [snip] Without me looking up specifications, if color has no meaning, then how do you propose to change the color of a horizontal rule? It is not a border, neither is it a background, so how else would you style its color property? To answer my own question, Mozilla obviously think it's a background element, but then you can't simply put printable characters on top of it, so they are breaking the rules. [snip] It is an empty container with a border which is not allowed to contain anything other than a background colour or background image. http://www.highdots.com/css-editor/html_tutorial/block/hr.html NOTE: Contents: Empty in the above. http://blakems.com/experimental/hr/ http://www.3internet.co.uk/resources/Design/theHRtag.aspx To compare browsers here is a test page (groove is usually the default for a hr line): http://www.comptutor.org/mytest/HR_Examples.html However the HTML specs on it are light allowing browser manufacturers to do as they please. No rules are being broken by either browser. HTML2: http://www.w3.org/MarkUp/html-spec/html-spec_5.html#SEC5.9 HTML3.2: http://www.w3.org/TR/REC-html32#hr HTML4: http://www.w3.org/TR/REC-html40/present/graphics.html#edef-HR I do ask you this, if it is the foreground that is see-through in IE then how does IE allow a background image? That question is rhetorical and requires you only to think it through. Upshot is if you want to acheive a solid colour HR either use both the background-color and color or use a solid coloured border and overflow hidden. I usually put a bottom border on the content div above instead but this is not always practical. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] header not at the top
On Sat, 22 Mar 2008 21:41:08 +0100 martin f krafft wrote: also sprach David Hucklesby [EMAIL PROTECTED] [2008.03.22.2121 +0100]: Pardon me if I am being obtuse, but why would you want to place the header anywhere other than at the head of the document? Well, isn't it still the case that the content of a document should be at the start for bots and text browsers to easily process? If you look at e.g. http://www.google.com/search?as_q=madduck%20blog, you'll see that Google summarises the first hit with This entire site is under construction and thoroughly incomplete! (Mar 2008) which is at the top of the page. Ideally, the title and first sentence should show up there, right? But if you have a META description, that will be placed there by Google. I count all sites as under construction. If anyone tells me they have 'finished' the website, I tell them they do not understand the web. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check-- Phoebe Taylor
On Sun, 09 Mar 2008 12:49:17 -0400
David Laakso wrote:
Phoebe Taylor wrote:
re: http://www.cgraytaylor.net/
Sure, I'd be up for it. :)
Just let me know what the challenge is...
Phoebe
OK. Some random CSS suggestions.
First off, you have done exceptionally well with CSS. Please accept
this, not as criticism of your effort, but rather as a means to take
it just a little further along.
The addition of:
html { min-height: 100%; margin-bottom: 1px; }
to the CSS file may help the short page shift.(if it even bothers
you, or your client-- it drives me nuts but I'm a little whacked
anyway) [1]
Stating at the top of the style sheet:
body, html {
margin : 0;
padding : 0;
}
body {
background-color: #1E1C1D;
font : 100% arial, helvetica sans-serif;
}
[snip]
If you copy and paste ensure you put a comma after helvetica in the
above line. Else browsers may look for a font helvetica sans-serif.
Simple typo that may not be picked up by the validator.
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] X-UA-Compatible - discrepancies between targeted behaviour in IE8 and actual behaviour
On Fri, 07 Mar 2008 22:50:06 + Alex Robinson wrote: http://www.fu2k.org/alex/css/cssjunk/ie8/xua In a nutshell, IE8's emulation of IE6 and IE5 does not appear to be off to a flying start. 1. Box model not honoured when targeting IE6 and in standards mode 2. Parsing errors not replicated when targeting IE5. Can someone confirm that the results show here are correct, or point out what I'm doing wrong? Could be as simple as expecting a Beta to behave like a full release. I heard somewhere (unreliable) not all proposed CSS is implemented yet in this Beta. It is just a for developer comments version. They expect feedback to improve it. http://blogs.msdn.com/ie/archive/2008/03/06/ie8-and-css-2-1-testing.aspx -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [OT] IE8 Beta released to developers.
Doesn't look very complete yet. And they have gone to best compliance is standard, you wont have to put the Meta tag in to get standards compliance. Beware the urls will probably wrap. http://blogs.msdn.com/ie/archive/2008/03/05/internet-explorer-8-beta-1-for-developers-now-available.aspx http://blogs.msdn.com/ie/archive/2008/03/03/microsoft-s-interoperability-principles-and-ie8.aspx -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Quickly Removing Formatting from an Element
On Tue, 04 Mar 2008 11:10:57 -0600 Jack Timmons wrote: Jukka, I had a spelling error in borders; it is incorrect, but is just an example. And simply put, she wanted an easy method for saying I don't want this button to have any of the previous global formatting applied to it. Using an ID on an element such as a button lets you compose CSS for that element independant from the rest of the website. http://www.google.com/search?hl=enq=css+specificity+tutorial It could also be that i have totally misread your needs. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pre-Loaders in CSS
On Fri, 29 Feb 2008 08:57:50 -0500 Christopher wrote: Anyone know in CSS if you can do a pre-loader effect ? Also can you do transitions as done by MooTools ? in CSS and if not does anyone know how you blend in MooTools into your HTML ? Not really AFAIK, but there are a couple of hacks i use. o Load an image as part of a background. Then reuse it for mouseovers. I often use it in the footer o Gather all your CSS and image files and send as one GZipped file to the browser. This method requires .htaccess magic. I think the tutorial i originally used was on www.sitepoint.com. Other tutorials may be available. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] give a solution for font family and size
On Thu, 28 Feb 2008 21:29:26 -1000 david wrote: Rob Emenecker wrote: No, it is not correct at all. There is no such requirement anywhere. Being correct does not mean there must exist a requirement, as your argument implies. If there is no requirement one way or the other, then having a FONT tag is as correct as not having a FONT tag. There's norequirement for me to wipe my bottom after using the toilet, but it certainly is correct to do so! ;) Jukka's right, there's nothing in the CSS rules that say you *can't* use formatting in the content itself. But what's the point of using things like the font tag when you're using CSS? It just seems sloppy to me, like something that my employer's ancient enterprise content management system might spit out. Here's a cheeky solution, especially for the CMS editors that aren't doing their job: http://accessites.org/site/2006/07/big-red-angry-text/ Have a chuckle but don't reply please. 1. its getting OT for this list 2. If you take it too seriously you could loose customers unless they specify CSS compliant code over font, size and color tags. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Request for Comments on this CSS Stylesheet Approach
On Mon, 18 Feb 2008 10:36:11 -0600
Jake Churchill wrote:
I'd set an ID in the body tag for each individual page and divide up
your CSS based on that. body id=index, body id=common, etc.
Then you've got
#index ... {
}
#common ... {
}
I do a lot of work with a product called Farcry which is a content
management system and this is how I change styles on a per-page basis.
This just feels like a cludge necessary only because of the restrictions
of your CMS.
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE vs FF Textarea Font Size Inconsistent
On Sat, 09 Feb 2008 18:38:14 -0500 Felix Miata wrote: On 2008/02/10 11:35 (GMT+1300) Michael Adams apparently typed: In addition Microsoft released the Core font set to the public and though discontinued by Microsoft free distribution was allowed under the original licence. These font are still being distributed third party and have been installed on the Linux computers of those that know what they are doing. http://en.wikipedia.org/wiki/Core_fonts_for_the_Web No distro I'm aware of installs them by default. There is no M$ software available for Linux that will automatically install them as on a Mac. As a result, you can't expect them to be installed on Linux. Agreed to a certain point. Mint may install the core font set by default. The Result *Helvetica is fine to use as a font for Linux Systems*. Apologies to the list for the way this has got OT, but i felt this needed addressing in the forum it was raised to prevent others taking Felix's information at face value. No need to take my word for it. See for yourself what can happen when CSS specifies Helvetica on Linux: http://mrmazda.no-ip.com/SS/Fnt/font-helvetica-linux-072.png http://mrmazda.no-ip.com/SS/Fnt/font-helvetica-linux-096.png http://mrmazda.no-ip.com/SS/Fnt/font-helvetica-linux-120.png http://mrmazda.no-ip.com/SS/Fnt/font-helvetica-linux-144.png http://mrmazda.no-ip.com/SS/Fnt/font-helvetica-linuxmdv2005-096.png All the above were shot on SUSE a couple years ago, but results were essentially the same on other distros, including Fedora and Mandriva. I went back as far as i could for this test (Mozilla1.6 on Mandrake10.0 circa 2004). http://www.comptutor.org/mytest/font-test-helvetica.html http://www.comptutor.org/mytest/images/mozilla-helvetica.png Looks to me like your test was possibly reverting to a default bitmap system font because Helvetica was not installed. So i've thrown in a font-family check indicating if it is installed. The Red H is always the same size in case your browser minimum size limits the lower end sizes. I had to cut my minimum from 14px to 6px for the test. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE vs FF Textarea Font Size Inconsistent
On Fri, 08 Feb 2008 21:49:27 -0500 Felix Miata wrote: On 2008/02/08 23:49 (GMT+1300) Michael Adams apparently typed: If you add helvetica to that font family that caters to most Mac and Linux users as well. font-family: Tahoma, Arial, Helvetica, sans-serif Helvetica, while very nice on Mac, is quite the opposite on Linux. http://mrmazda.no-ip.com/auth/Font/font-helvetica.html#bitmap On those newer Linux systems that actually have Helvetica installed, it will only show up if you request adobe helvetica, which is a bitmap font available in limited sizes that are poorly suited for web page screen display even when the size is actually correct. In most other cases, there will be no Tahoma or Arial, and the fontconfig fallback or alias will usually be DejaVu Sans or Bitstream Vera Sans, both of which are equivalent in size and appearance to Verdana, larger in apparent size than Tahoma, Arial Mac Helvetica. I have been using Linux since 1999 and Helvetica was a Type1 font then. Type1 fonts are not bitmap fonts and should not be confused with the system fonts used when X11 is not installed. In 1999 support for TrueType fonts was scratchy but available. http://www.freebsd.org/doc/en_US.ISO8859-1/books/handbook/x-fonts.html http://www.codestyle.org/css/font-family/sampler-UnixResults.shtml http://en.wikipedia.org/wiki/Type_1_and_Type_3_fonts#History In addition Microsoft released the Core font set to the public and though discontinued by Microsoft free distribution was allowed under the original licence. These font are still being distributed third party and have been installed on the Linux computers of those that know what they are doing. http://en.wikipedia.org/wiki/Core_fonts_for_the_Web What used to happen on Linux if you did not have your system set up correctly is that fonts can look either pixelated or fuzzy, (expecially in KDE if i remember correctly) this problem occured periodically due to clashes between the various different video cards, X11, and display managers and altering Anti-Alias settings is usually the fix. This issue exhibited most in OpenOffice.org. I have never experienced this issue. The Result *Helvetica is fine to use as a font for Linux Systems*. Apologies to the list for the way this has got OT, but i felt this needed addressing in the forum it was raised to prevent others taking Felix's information at face value. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE vs FF Textarea Font Size Inconsistent
On Fri, 08 Feb 2008 11:06:56 +0100 Mihai M__nu wrote: Hi Michael, Your problem is typographic. The font used for text area is smaller than the font used for inputs (default fonts are sans-serif for input select, and fixed for text area - on Linux those fonts are configured system wide, they can be anything you choose). It is strongly dependent on the default fonts used by FF (and the fonts installed on the machine). In order to fix your problem, just add font-family: Tahoma, Arial, sans-serif (for example) in the input, select, textarea definition. Even if your Linux does not have the Tahoma or Arial fonts installed, you will still make the sans-serif default font go in all types of inputs. If you add helvetica to that font family that caters to most Mac and Linux users as well. font-family: Tahoma, Arial, Helvetica, sans-serif -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] start an ordered list at a number 1
On Thu, 07 Feb 2008 09:50:56 -0800 (PST) [EMAIL PROTECTED] wrote: Hi Is there a way to start an ordered list at anything other than 1? I'm having a problem with QA type of page that numbers the questions, but it also needs some blubs between the questions. Kind of like below: ol liblahblah?br fieldset.../fieldset pneed to insert yadayada/p /li lianother question fieldset and so forth/li /ol is quite valid. The P tag must be a child of the LI not the OL. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] OT start an ordered list at a number 1
On Thu, 07 Feb 2008 20:44:01 -0500 Tim White wrote: On Feb 7, 2008 7:57 PM, Jim Nannery [EMAIL PROTECTED] wrote: So much for going off list. *doh* wrong button. Mea culpa. No, you replied to my post. And to prevent replies off list (This email address is one way = no spam) i have set an explicit reply to: to the list. If you'd replied to the OP you could have stayed off list. Please do not reply on this subject as it is OT for this list but needed clearing up. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE vs FF Textarea Font Size Inconsistent
On Thu, 07 Feb 2008 11:43:00 -0500 Michael B Allen wrote: The font size in textarea elements on Firefox (on Linux at least) is about 70% the size of other input and select elements in the same form whereas in IE the font size is roughly the same across all form elements. I suspect this has more to do with the fact that textarea uses a courier font-family and FF preferences specifically use a smaller font for Courier but of course I have no control over that. So how does one get the same textarea font size behavior between FF and IE? Mike Do a minimal page as an example, you may find one of several things: * Your above conclusion is right. * You have set textarea and div fonts at 70% so your textarea is 70% of the div which is already 70% of the body. * Something else is breaking it. Firebug is your friend. OR Post a link tothe example you have. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Using CSS to control PDF for print
On Fri, 01 Feb 2008 18:46:35 +1100 Chang Huang wrote: Hi all, I've been reading about how to use CSS to control the layout of a web for print, I wonder is there's a optimum way to style a web-generated PDF for print. I've been googling it for a while but with no success. Can anyone point me to the right direction please? Also one thing that is so glaring that you probably have not failed to notice. PDFs created on the fly on the server are dependent on the fonts on the server, if it isn't on the server it can't get embedded. Web pages created in HTML are dependent on the fonts at the client. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Noob with float/div problems
On Fri, 01 Feb 2008 04:11:15 -0800
Ken Davies wrote:
Hello and thanks for letting me join your group, although it's very
intimidating for a novice.I am definitely not a hand coder, but I sure
have changed a lot of code by hand. I built a table oriented image
heavy website no CSS. I struggle to get to first base with CSS on my
top banner, it should be simple- changing the text between my logo and
a gif one of my rings. It is presently a fixed size table that I think
should expand to the browser.
In addition to Arlen's words of wisdom. If the image isn't vital to the
page content then put it in the background. The jewellery item at the
right could be in the background.
#banner {
background: url(/images/Animation11.gif) right center no-repeat;
}
#banner p {
padding-right: 83px; /* leaves Animation11.gif uncovered */
}
Putting it in the background makes it part of the template and releases
it from the requirement to have alt text. The background center is
optional as vertical centering is the default, i put it in, but you
could change it to top, bottom or delete it if you choose.
Also it looks like that image is meant to be an animation but my browser
reports an error in the image and no animation takes place.
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] XHTML 1.0 Transitional and IE6
On Thu, 24 Jan 2008 15:19:37 +0100
Gunlaug Sørtun wrote:
Michael Adams wrote:
Using a two column negative margin layout, only IE5, IE5.5 and IE6
all show the sidebar below the main content, though everything looks
offset correctly in the x direction. First time i've tried working
in quirks mode and wonder if anyone can see my overlooked issue.
http://demo.realpeople.gen.nz
IE6 (regardless of mode) and below do not respect declared dimensions.
The result is a too wide sidebar - making it drop.
Adding...
* html #sidebar {overflow-x: hidden; margin-right: -10px;}
...will keep sidebar-width under control, and provide some extra space
for IE/win's calculation bugs.
Much appreciated, and credited you in the comments :)
--
Michael
All shall be well, and all shall be well, and all manner of things shall
be well
- Julian of Norwich 1342 - 1416
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a couple of questions: dif style sheets and min height??
On Mon, 21 Jan 2008 15:47:13 + Rob freeman wrote: Hello again everyone.. Just a couple of questions... I have built a little site which uses png's. These images sit slightly off the wrapper div. The image have a drop shadow which all works in the latest browsers. Now, if I want to keep the shadow in explorer 6 and below I have to use a alpha filter, which I need to look into. Has anyone used this filter for older browsers? and does the it validate properly? Or, could you use different images without shadows but only display these for IE browsers 6 and below...Is this possible? Have you considered making the shadow a part of the original image. The KISS rule applies here. Given it's position you could take a screen snapshot including the edge of the background and resave it as a jpg. 24/32 bit PNG's are not really web friendly (very slow on dialup). Because the my sites type renders different on certain screens resolutions, where the image on the right has an absolute position, the contents section's height gets very small, almost allowing the png file to touch the footer. Is there a way I can set a Min size height to the content div? I dont want set a total height if possible.. It needs to stay validated in all browsers..?? min-height: is a valid css property but IE7 does not recognise it. If you set your body font as a percentage then use EM's to scale it (where 1em = 100%) you will resolve many font issues. Using percentages throughout can result in trouble with nested font scaling (you get 90% of 90%). To be honest i haven't taken the time to check if this is your issue. Work beckons... URL: http://www.precociouscollective.com/testfolder/ Thanks for all your help..this is a great list..! Hope i have helped. -- Michael All shall be well, and all shall be well, and all manner of things shall be well - Julian of Norwich 1342 - 1416 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
