Re: [css-d] mozilla width problem
On 24/07/07, Melinda Odom [EMAIL PROTECTED] wrote: I'm having a problem with this php store and getting the center lined up in mozilla and firefox: http://www.lookatmebaby.com/index.php IE7 looks ok. You have a Doctype that triggers Quirks mode and causes IE to put padding inside the width instead of between the width and the border. http://css-discuss.incutio.com/?page=RenderingMode You also have syntax errors: http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.lookatmebaby.com%2Findex.php And are abusing tables for layout (nested tables for that matter). I suggest dealing with those issues first (the width issue is very likely related to them) -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] :: mac/ie5.2 min-height ::
Of the clickable pages only the About page (top left link) is not honoring a min-height filter for the header. Where be my error? login: sg pass: Q79apM uri: http://www.chelseacreekstudio.com/ca/celiac/ css for the about page: http://www.chelseacreekstudio.com/ca/celiac/ct/css/utility.css Thank you. ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] floating right in ie7 with hasLayout
is there any way to un-hasLayout an element that has gained it? if not (and from what i've seen and read, there isn't), is there a way to get around the trigger when it comes to floating elements? my situation is almost exactly the same as the examples at http://dev.l-c-n.com/IEW2-bugs/float-adjecant2.php except that i'm using min-height instead of widths on mine to make sure a background image doesn't get vertically cut off. the makers of l-c-n didn't offer any solutions that i could find. any advice? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] mozilla with problem
Hi, I'm having a problem with this php store and getting the center lined up in mozilla and firefox on this first page only: http://www.lookatmebaby.com/index.php IE7 looks ok. The width is 940 for the whole site. Thanks! Sincerely, Melinda Odom Design Hosting, Inc. www.designhosting.biz 479-471-0891 No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.476 / Virus Database: 269.10.16/914 - Release Date: 7/23/2007 7:45 PM __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ab pos disappears in IE6
Hey Neal, If #articleOptions is absolutely positioned, and why not set its parent #pad to position:relative, so the absolutely positioned block #articleOptions is based off that location. On 7/23/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: on this link: http://www.raiders.com/Common/Article.aspx?id=26034 view it in IE6 and you will see ul#articleOptions is pushed down because the headline went to 2 lines - - it is absolutely positioned on FF and IE7 but if Absolutely positioned in IE6 it disappears - so I floated it - but on this page you can see my problem. I looked all over and nothing is fixing it - anybody have any suggestions on how I can absolutely position this and have it not disappear in IE6 Thanks Neal __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] floating right in ie7 with hasLayout
On Jul 24, 2007, at 11:14 PM, cj wrote: is there any way to un-hasLayout an element that has gained it? if not (and from what i've seen and read, there isn't), is there a way to get around the trigger when it comes to floating elements? my situation is almost exactly the same as the examples at http://dev.l-c-n.com/IEW2-bugs/float-adjecant2.php except that i'm using min-height instead of widths on mine to make sure a background image doesn't get vertically cut off. the makers of l-c-n didn't offer any solutions that i could find. Short of removing the offending property (min-height in your case), no. Ok, what about this: making sure that your element has enough content in order to show your background image ? Then you don't need the 'hasLayout' trigger, min-height here. http://www.satzansatz.de/cssd/onhavinglayout.html#reset lists _some_ ways to reset (un-Layout). An article that makes the 'Divina Comedia' feel like a description of paradise. Philippe --- Philippe Wittenbergh http://emps.l-c-n.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Type Sizing
Hello everybody, I've been struggling with reliable alternatives to pixel-based type sizing methods, but I haven't been able to find any. I've read many articles on this subject. It's perhaps the aspect of standards-based coding that for some reason I find the most confusing. Here is an example: http://windows.pedrera.com/clients/omnia/temp/ With this template, I used a percentage (62.5%) to set the root parent size for the body and then used em units to set the size of all child elements. This seemed to work well on IE 7, Firefox 2, and Safari 3 on my system (Win XP 2002, SP2), but on my boss's machine (which is, I think, basically identical to mine), the sizing method doesn't work on IE 7. The text is too large, as if the Text Size were set to Larger. I checked his browser settings - the Text Size was set to Medium (as it was for my browser). Am I missing something? We have the same versions of IE, our Text Size settings are the same, but his browser is rendering the type larger than mine by an order of magnitude. Thanks, John John Gribben Pedrera, Inc. 215 348 7446 [EMAIL PROTECTED] http://www.pedrera.com http://www.pedrera.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type Sizing
John Gribben wrote: http://windows.pedrera.com/clients/omnia/temp/ Am I missing something? We have the same versions of IE, our Text Size settings are the same, but his browser is rendering the type larger than mine by an order of magnitude. Thanks, John Maybe he's like me and can't read mousetype. See if his browser is in accessibility mode with the ignore font sizes specified on webpages box checked. Regards, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] floating right in ie7 with hasLayout
On 7/24/07, Philippe Wittenbergh [EMAIL PROTECTED] wrote: Ok, what about this: making sure that your element has enough content in order to show your background image ? Then you don't need the 'hasLayout' trigger, min-height here. for the default text size (at least on my computer - i haven't changed it), the background image (an expand/collapse arrow) displays fine without the min-height rule. i coded my header sizes in em, but the background image is (of course) in pixels, so as long as someone viewing the page sees the header size as 15px or more, it's not an issue. i wanted to make sure people with smaller font sizes (or dpi, or whatever) could still see the whole arrow though, which is why i added the rule. http://www.satzansatz.de/cssd/onhavinglayout.html#reset lists _some_ ways to reset (un-Layout). what makes your suggestion of this site so ironic is that that's where i went to see what the ie7 hasLayout triggers were to confirm that one of my rules was giving (or not giving) my header hasLayout. obviously i should have keep reading. :p in my case i'll just break the min-height rule for ie7 by overriding the minimum i set in my for all browsers rule with an ie7-specific auto. in the rare case someone on ie7 will see a cutoff arrow, they'll just have to live with it i guess. fortunately i don't think it will be a common situation at all. thanks for the help philippe. :) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Aural Style Sheets
Good day list, I am preparing to begin work for a client whose site must meet Bobby compliance, particularly to accommodate their blind visitors. Along with digesting the W3C accessibility guidelines, I've discovered Aural Cascading Style Sheets (ACSS). From the handful of more recent articles I found on this subject, it appears that it still is not well-supported in speech readers. I would appreciate any advice (and links) from those of you familiar with designing for this audience. Additionally, recommendations for commonly used speech reader browsers that I could download for testing the site would be great (i.e., Emacspeak). Thanks, Denise __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: mac/ie5.2 min-height ::
David Laakso wrote: Of the clickable pages only the About page (top left link) is not honoring a min-height filter for the header. Where be my error? login: sg pass: Q79apM uri: http://www.chelseacreekstudio.com/ca/celiac/ css for the about page: http://www.chelseacreekstudio.com/ca/celiac/ct/css/utility.css Thank you. ~dL In the About page, I cannot spot any difference between IEMac5.2 and Firefox 2.0.0.5/Mac. While this is exciting, where is the error? Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] H2 background to work like sliding doors
Hello, I have a rounded black box under a h2 element and I want it to work like sliding doors - to be longer when the text is longer, and vice versa. But now it has width as it's container box and I don't know how to solve that, look here http://erikgyepes.com/problem/. Thanks for any advices. Erik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type Sizing
John Gribben wrote: I've been struggling with reliable alternatives to pixel-based type sizing methods, but I haven't been able to find any. I've read many articles on this subject. It's perhaps the aspect of standards-based coding that for some reason I find the most confusing. Here is an example: http://windows.pedrera.com/clients/omnia/temp/ With this template, I used a percentage (62.5%) to set the root parent size for the body and then used em units to set the size of all child elements. This seemed to work well on IE 7, Firefox 2, and Safari 3 on my system (Win XP 2002, SP2), but on my boss's machine (which is, I think, basically identical to mine), the sizing method doesn't work on IE 7. The text is too large, as if the Text Size were set to Larger. I checked his browser settings - the Text Size was set to Medium (as it was for my browser). I would argue that 62.5% of anyone's base font size is too small, accept their font size preference, and enjoy the serenity of knowing that site visitors can read the text without having to increase font size ... ;-) -- David [EMAIL PROTECTED] authenticity, honesty, community __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: mac/ie5.2 min-height ::
Ingo Chao wrote: David Laakso wrote: Of the clickable pages only the About page (top left link) is not honoring a min-height filter for the header. Where be my error? login: sg pass: Q79apM uri: http://www.chelseacreekstudio.com/ca/celiac/ css for the about page: http://www.chelseacreekstudio.com/ca/celiac/ct/css/utility.css Thank you. ~dL In the About page, I cannot spot any difference between IEMac5.2 and Firefox 2.0.0.5/Mac. While this is exciting, where is the error? Ingo This is embarrassing. I see now it is fixed, too. Apparently I wrote prior to uploading the correct style sheet for that page. Apology for wasting your valuable time! ~d -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aural Style Sheets
Denise wrote: I would appreciate any advice (and links) from those of you familiar with designing for this audience. I, too, would like to have some of this information as I've only briefly toyed with the idea of learning aural style sheets. So, please either post them to the list (since it's still dealing with css, just a particular derivative) or cc me in :) Additionally, recommendations for commonly used speech reader browsers that I could download for testing the site would be great (i.e., Emacspeak). I don't know of too many, I've not mucked around too much with them yet. However, I know of Jaws (you can download a free trial but I believe after that there's a registration fee) or, if you're using firefox, there's a free plugin called FireVox. HTH! -- Thanks, Jim __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] H2 background to work like sliding doors
-BEGIN PGP SIGNED MESSAGE- Hash: SHA1 Erik Gyepes wrote: Hello, I have a rounded black box under a h2 element and I want it to work like sliding doors - to be longer when the text is longer, and vice versa. But now it has width as it's container box and I don't know how to solve that, look here http://erikgyepes.com/problem/. Does setting the background-color to black in h2.box work? background: #00 url(images/black-box-right.png) no-repeat; Hope this helps, Ricky -BEGIN PGP SIGNATURE- Version: GnuPG v1.4.7 (GNU/Linux) iD8DBQFGpjqZZBKKLMyvSE4RAnlGAKCTyd5FAGIRBQ4aaEG59SOr4v0poQCgsJV0 tPFwgZu+pSnA22GOYvc1vxk= =JzD0 -END PGP SIGNATURE- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type Sizing
John Gribben wrote: Hello everybody, I've been struggling with reliable alternatives to pixel-based type sizing methods, but I haven't been able to find any. I've read many articles on this subject. It's perhaps the aspect of standards-based coding that for some reason I find the most confusing. Here is an example: http://windows.pedrera.com/clients/omnia/temp/ With this template, I used a percentage (62.5%) to set the root parent size for the body and then used em units to set the size of all child elements. This seemed to work well on IE 7, Firefox 2, and Safari 3 on my system (Win XP 2002, SP2), but on my boss's machine (which is, I think, basically identical to mine), the sizing method doesn't work on IE 7. The text is too large, as if the Text Size were set to Larger. I checked his browser settings - the Text Size was set to Medium (as it was for my browser). Am I missing something? We have the same versions of IE, our Text Size settings are the same, but his browser is rendering the type larger than mine by an order of magnitude. Thanks, John Hi John Go into IE7, Tools | Internet Options, then General | Accessibility and tick the Ignore font styles specified on webpages box. This is what your boss is most likely doing. My screen resolution is 1280 by 800 pixels and the font on the page is awfully hard to read. If your font size 62.5% is overridden in IE7 or any other browser, your page falls apart. This even happens after normal text resizing x 2, but not to the same degree. Go into IE7, Tools | Internet Options, then General | Colors and untick the Use Windows colors box and select a background color. Now in IE7, resize the text to largest and discover between the heading Upcoming Events and the footer, this background coming through. This is because the body background image is only 900px in height and repeating on the x-index. A simple background color on your html/body element would resolve this. You have a quite pleasant design but these layout issues after text resizing need to be addressed. Kind Regards, Alan __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] H2 background to work like sliding doors
Hi Ricky, yes I believe that works but I don't want so width background, I need just as long as the h2 text :( Erik Ricky Zhou wrote: -BEGIN PGP SIGNED MESSAGE- Hash: SHA1 Erik Gyepes wrote: Hello, I have a rounded black box under a h2 element and I want it to work like sliding doors - to be longer when the text is longer, and vice versa. But now it has width as it's container box and I don't know how to solve that, look here http://erikgyepes.com/problem/. Does setting the background-color to black in h2.box work? background: #00 url(images/black-box-right.png) no-repeat; Hope this helps, Ricky -BEGIN PGP SIGNATURE- Version: GnuPG v1.4.7 (GNU/Linux) iD8DBQFGpjqZZBKKLMyvSE4RAnlGAKCTyd5FAGIRBQ4aaEG59SOr4v0poQCgsJV0 tPFwgZu+pSnA22GOYvc1vxk= =JzD0 -END PGP SIGNATURE- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type Sizing
On Tue, 24 Jul 2007 11:17:12 -0400, John Gribben wrote: [...] http://windows.pedrera.com/clients/omnia/temp/ With this template, I used a percentage (62.5%) to set the root parent size for the body and then used em units to set the size of all child elements. This seemed to work well on IE 7, Firefox 2, and Safari 3 on my system (Win XP 2002, SP2), but on my boss's machine (which is, I think, basically identical to mine), the sizing method doesn't work on IE 7. The text is too large, as if the Text Size were set to Larger. I checked his browser settings - the Text Size was set to Medium (as it was for my browser). Am I missing something? We have the same versions of IE, our Text Size settings are the same, but his browser is rendering the type larger than mine by an order of magnitude. Hi John, Check your boss's DPI settings. IE (and Opera) default to 12 points. At 96 DPI this translates to 16 pixels, but at higher DPI is more pixels, which seems to be what you are experiencing. At 120 DPI 12 points comes out at 20 pixels, for example. You may like to re-think your 62.5% base font. It can give rise to inheritance problems where minimum font sizes are set[1]. If you are looking for a base font that makes calculations easier, I suggest 106.25% which is 10 points at 96 DPI. This makes designing to a scale or vertical rhythm easier, as suggested by Mark Boulton[2] and others. [1] http://www.gunlaug.no/contents/wd_1_03_04.html [2] http://tinyurl.com/e2eph Cordially, David -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: mac/ie5.2 min-height ::
Hi David,
I mistakenly thought that the problem was noticeable when you compared the
about page with another one (say Medicine), both in IE 5.2 on the Mac.
I noticed that CELIAC TODAY in the banner below the nav is positioned
differently on the two pages, and thought that might have something to do
with it.
I found that the style for the h1 tag is different for the two pages, when I
used the same code for both pages, the text lined up in the same spot on
both pages.
I'm sending the info in case you want both pages to look the same:
In the utility.css file used by the About page the h1 block is:
h1 {
color : #eee685;
font-size : 270%;
font-weight : normal;
letter-spacing : -0.03em;
line-height : 0.95;
margin : 10px auto 0 auto;
word-spacing : -1em;
text-align : center;
}
In the common.css file used by the Medicine page the h1 block is:
h1 {
color : #eee685;
font-size : 270%;
font-weight : normal;
letter-spacing : -0.03em;
line-height : 0.95;
margin : 0 0 0 8px;
padding-top : 12px;
word-spacing : -1em;
text-align : center;
width : 400px;
}
Be Well,
Joe
- Original Message -
From: David Laakso [EMAIL PROTECTED]
To: Ingo Chao [EMAIL PROTECTED]
Cc: css discuss css-d@lists.css-discuss.org
Sent: Tuesday, July 24, 2007 1:32 PM
Subject: Re: [css-d] :: mac/ie5.2 min-height ::
Ingo Chao wrote:
David Laakso wrote:
Of the clickable pages only the About page (top left link) is not
honoring a min-height filter for the header. Where be my error?
login: sg
pass: Q79apM
uri:
http://www.chelseacreekstudio.com/ca/celiac/
css for the about page:
http://www.chelseacreekstudio.com/ca/celiac/ct/css/utility.css
Thank you.
~dL
In the About page, I cannot spot any difference between IEMac5.2 and
Firefox 2.0.0.5/Mac. While this is exciting, where is the error?
Ingo
This is embarrassing. I see now it is fixed, too. Apparently I wrote
prior to uploading the correct style sheet for that page. Apology for
wasting your valuable time!
~d
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] css 'slanted border line' background-image (often seen in centered blogs)
Hello all, Often you see subtle slanted lines making up the background on blogs. I have a simple example here (but mine does't line up and not so subtle :)- http://arihoj.freehostia.com/css/pattern/testBackground.html There are 3 images, one for body background, and one on each side of centered container (alot of times on a nice blog for these side images, i'll see nice lightly shadowed images and slanted lines behind the shadow part of pic; all I assume in same image but 'repeat-y'ed and it'll match up with background slanted image lines). Now when the pattern is 'perfectly aligned', then its easy to make these images. For example, an image similar to one i created with a line slant and height equal to pretend 10 pixels high, can be cut and pasted at spacings of 10 pixels. But my example has slants 'overlapping' the next slant. I'm was actually curious how the borders are made when they arent 'perfectly' aligned. I had a sneaky suspicion its the Pattern Maker filter in Photoshop which I havent ever really used. Any good css tutorials on making these kinda images? Thanks, Ari __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type Sizing
On 2007/07/24 11:17 (GMT-0400) John Gribben apparently typed: I've been struggling with reliable alternatives to pixel-based type sizing There's little reliable about px sizing fonts except to guarantee large numbers of visitors to be unable to read your mousetype. http://www.useit.com/alertbox/designmistakes.html IE's text resizer doesn't work on px sized text, thereby rendering many unable to restore it to a legible size. http://css-discuss.incutio.com/?page=UsingPixels methods, but I haven't been able to find any. I've read many articles on http://clagnut.com/blog/348/ for instance? This we've covered before, e.g. http://archivist.incutio.com/viewlist/css-discuss/87185 and http://mrmazda.no-ip.com/SS/Clagnut/eonsSS.html . Where else? Have you looked at any of the sites on http://cssliquid.com/ or at http://mrmazda.no-ip.com/auth/Sites/dlviolin.html or http://mrmazda.no-ip.com/auth/Sites/ksc/ ? this subject. It's perhaps the aspect of standards-based coding that for some reason I find the most confusing. Maybe the lack has to do with understanding how inheritance affects fonts? Keyword sizes are one solution that avoids inheritance difficulty until you gain better understanding. http://css-discuss.incutio.com/?page=UsingKeywords Here is an example: http://windows.pedrera.com/clients/omnia/temp/ With this template, I used a percentage (62.5%) to set the root parent size for the body Why? You don't know what size 100% is anywhere but on systems you can see. When you stop thinking in arbitrary units (px) and instead think in relative units (e.g. em or %), there's no need for arbitrary base level adjustment or the arbitrary barriers to access that arbitrary adjustments impose. If you think a base level adjustment is required, the right place to do it is in your browser, not the CSS. Just be sure to test with other browser default sizes ranging from 7-8pt real up to 16pt real or more (or corresponding text zoom) and window sizes up to at least .3m wide when done to ensure usability remains for the widest possible spectrum of non-blind visitors. and then used em units to set the size of all child elements. This seemed to work well on IE 7, Firefox 2, and Safari 3 on my system (Win XP 2002, SP2), but on my boss's machine (which is, I think, basically identical to mine), the sizing method doesn't work on IE 7. The text is too large, as if the Text Size were set to Larger. I checked his browser settings - the Text Size was set to Medium (as it was for my browser). Too large for who? Was he complaining it was too large? How old is he? How old are you? How large is his display? Yours? What resolution does he use? You? What actual pt sizes do you estimate his is/was? Yours? Am I missing something? We have the same versions of IE, our Text Size settings are the same, but his browser is rendering the type larger than mine by an order of magnitude. Is that page the only thing on his desktop with different sized fronts from yours, or are other things on his larger too? It sounds like there's an important difference between his and yours - probably 96 DPI (normal fonts) on yours and 120 DPI (large fonts) on his. -- All scripture is God-breathed and is useful for teaching, rebuking, correcting, and training in righteoousness. 2 Timothy 3:16 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] H2 background to work like sliding doors
Hi,
I've played a little with it and now it works:
h2.box
{
background: url(images/black-box-right.png) no-repeat right;
color: #9fcc58;
display: inline;
padding: 5px 10px 5px 0;
}
h2.box span {
background: url(images/black-box-left.png) no-repeat left;
display: inline;
padding: 5px 0 5px 10px;
}
So thank you very much! I appreciate it :)
Erik
Ricky Zhou wrote:
-BEGIN PGP SIGNED MESSAGE-
Hash: SHA1
Erik Gyepes wrote:
Hi Ricky,
yes I believe that works but I don't want so width background, I need
just as long as the h2 text :(
Well, this is untested in most browsers and might completely blow up, but:
h2.box
{
background: #00 url(images/black-box-right.png) no-repeat right;
color: #9fcc58;
display: inline;
line-height: 30px;
padding: 15px 0;
}
h2.box span {
background: url(images/black-box-left.png) no-repeat left;
display: inline;
padding: 15px 10px;
}
Hope this helps,
Ricky
-BEGIN PGP SIGNATURE-
Version: GnuPG v1.4.7 (GNU/Linux)
iD8DBQFGpkAcZBKKLMyvSE4RAsImAJ0S+MXgVXO5KymnaMWS8k215YLbrwCgjprz
HOxTPFC2auUr7CGiK8/4Rmc=
=IB+h
-END PGP SIGNATURE-
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ab pos disappears in IE6
Thanks for the suggestion Arian anytime position: relative is added (anywhere in the module) the articleOptions list disappears Think this is a doctype issue - - Hey Neal, If #articleOptions is absolutely positioned, and why not set its parent #pad to position:relative, so the absolutely positioned block #articleOptions is based off that location. On 7/23/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: on this link: http://www.raiders.com/Common/Article.aspx?id=26034 view it in IE6 and you will see ul#articleOptions is pushed down because the headline went to 2 lines - - it is absolutely positioned on FF and IE7 but if Absolutely positioned in IE6 it disappears - so I floated it - but on this page you can see my problem. I looked all over and nothing is fixing it - anybody have any suggestions on how I can absolutely position this and have it not disappear in IE6 Thanks Neal __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Site Check
I am looking for a site check before I begin to add content to this site. The HTML link is: http://www.eddysound.com/filing/ The CSS link is: http://www.eddysound.com/filing/style/epso.css First, I have a few problems in IE 6. There is a 4 pixel gap between the header and content div. Why is this? Of course Firefox shows it correctly without the gap. Any ideas on how to fix this? Second, is there a better way to style my secondary and tertiary navigation in regards to line height / padding / margin? In IE 6 the navigation becomes extremely spacious and looks terrible. Any help or suggestions would be greatly appreciates to fix this. I am currently using the line-height attribute but feel there might be a better way. If you have any other suggestions or ways in which I can make this site better please feel free to let me know. Thanks, Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aural Style Sheets
At 12:42 PM -0400 7/24/07, Denise wrote: I am preparing to begin work for a client whose site must meet Bobby compliance, particularly to accommodate their blind visitors. Along with digesting the W3C accessibility guidelines, I've discovered Aural Cascading Style Sheets (ACSS). From the handful of more recent articles I found on this subject, it appears that it still is not well-supported in speech readers. That's my reading, although the support is far more widespread than once it was. I recommend http://dotjay.co.uk/tests/css/aural-speech/ as a good starting point for what's supported, and by whom. -- Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone CSS is much too interesting and elegant to be not taken seriously. -- Martina Kosloff (http://mako4css.com/) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Table extending past 100% of browser window width
hello, I am having problems with tables that are too wide for a browser window. The client has existing html code that they cannot change in the near future and so I have to work with whats already there, and whats there is very very ugly. Here is the example: http://www.un-identified.com/ipa/example.html The containing div doesnt wrap around the whole table in both FF2 and IE7. Been banging my head on this all day. Hopefully someone can help. Note: There are validation errors, but I dont think they are critical. They are there mainly because someone who didn't know much about html coded this whole application and I purposefully kept those errors in there, because i want to be able just apply this design right over what they already have and fix the code as I go. Thanks, Parag __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ab pos disappears in IE6
[EMAIL PROTECTED] wrote: on this link: http://www.raiders.com/Common/Article.aspx?id=26034 Did not look into your page, but disappearing a.p. boxes in IE are covered in this article by Bruno Fassino http://www.brunildo.org/test/IE_raf3.html Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ab pos disappears in IE6
Thanks Ingo I went over that page trying the cures and it did not work - - I used that page before and it worked - - I have to give up on it thanks we are all looking forward to the day IE6 croaks [EMAIL PROTECTED] wrote: on this link: http://www.raiders.com/Common/Article.aspx?id=26034 Did not look into your page, but disappearing a.p. boxes in IE are covered in this article by Bruno Fassino http://www.brunildo.org/test/IE_raf3.html Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ab pos disappears in IE6
[EMAIL PROTECTED] wrote: http://www.raiders.com/Common/Article.aspx?id=26034 As first thing I would make sure that you have a position:relative parent with hasLayout. The only relative positioned parent that I found at the quick look is the #subPageBackNewsroom div. Give layout to it (with zoom:1, just to test), make your #articleOptions absolute and remove its negative margin top. It seems to show up, but I just tested with the IE dev toolbar which is not too reliable for this disappearing problems. Hth, Bruno -- Bruno Fassino http://www.brunildo.org/test __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: mac/ie5.2 min-height ::
Joe Schmitt wrote:
Hi David,
I mistakenly thought that the problem was noticeable when you compared the
about page with another one (say Medicine), both in IE 5.2 on the Mac.
{trimmed]
Joe
login: sg
pass: Q79apM
uri:
http://www.chelseacreekstudio.com/ca/celiac/
~dL
The discrepancy in the coding of h1 between the major and minor sets of
pages is noted and will be corrected.
Thank you for bringing this to my attention.
Best,
~dL
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Dissapearing elements in IE6
Hello, URL: http://erikgyepes.com/problem1/ The page looks okay in Firefox and Oper, but when I look on it with IE6 then the US states title dissapears. Also with the All makes title which is on the bottom of the page. Does anyone know how to fix this? Erik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check
Hi Matthew,
I got rid of the 4 pixel gap by removing extra spaces in the html code for
the header section:
div id=header
div id=header_leftimg src=images/left_corner_patch.jpg alt=Top
half of patch. height=88 width=141/div
div id=header_centerimg src=images/header_center.jpg alt=Website
logo. height=88 width=300/div
div id=header_rightimg src=images/right_corner_creators.jpg
alt=Creators of the website. height=88 width=324/div
div class=clear/div
/div
Not sure why but adding border: 1px solid #f2aa20; to the .leftnav li
styling in the CSS file removes the extra space in the left nav.
any color works, but if change it to a 0px border the extra space comes
back.
So, it's a hack, but maybe you can use it as a starting point to figure out
the problem.
.leftnav li {
font-family: Times New Roman, Times, serif;
font-size: 12pt;
text-align: center;
line-height: 18pt;
border: 1px solid #f2aa20;
}
Be Well,
Joe
- Original Message -
From: Your Name [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, July 24, 2007 3:25 PM
Subject: [css-d] Site Check
I am looking for a site check before I begin to add content to this site.
The HTML link is: http://www.eddysound.com/filing/
The CSS link is: http://www.eddysound.com/filing/style/epso.css
First, I have a few problems in IE 6. There is a 4 pixel gap between the
header and content div. Why is this? Of course Firefox shows it correctly
without the gap. Any ideas on how to fix this?
Second, is there a better way to style my secondary and tertiary
navigation in regards to line height / padding / margin? In IE 6 the
navigation becomes extremely spacious and looks terrible. Any help or
suggestions would be greatly appreciates to fix this. I am currently using
the line-height attribute but feel there might be a better way.
If you have any other suggestions or ways in which I can make this site
better please feel free to let me know.
Thanks,
Matthew Stoneback
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check - EPCCJC
On 2007/07/24 15:25 (GMT-0400) Your Name apparently typed: I am looking for a site check before I begin to add content to this site. The HTML link is: http://www.eddysound.com/filing/ The CSS link is: http://www.eddysound.com/filing/style/epso.css Second, is there a better way to style my secondary and tertiary navigation in regards to line height / padding / margin? In IE 6 the navigation becomes extremely spacious and looks terrible. Any help or suggestions would be greatly appreciates to fix this. I am currently using the line-height attribute but feel there might be a better way. Line-height is best set using no units: http://mrmazda.no-ip.com/auth/line-height-inherit.html Font-size is best not set in pt. IE users' font resizer can't be use to adjust them. http://css-discuss.incutio.com/?page=UsingPoints In most browsers 12pt is the same thing as CSS medium, so wherever you now have a size set to 12pt, you can simply dispense with the rule entirely, or substitute medium. http://css-discuss.incutio.com/?page=UsingKeywords If you have any other suggestions or ways in which I can make this site better please feel free to let me know. http://juicystudio.com/services/colourcontrast.php will help you with a colors problem. You have no background color set. Your page is less than half the width of my screen regardless how wide my browser window is. It'll probably work better with a width that depends on font size rather than some arbitrary number of px. See e.g. http://mrmazda.no-ip.com/auth/Sites/ksc/ regarding this and nav styling. -- All scripture is God-breathed and is useful for teaching, rebuking, correcting, and training in righteoousness. 2 Timothy 3:16 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] RE : Aural Style Sheets (to Denise) [CSSD 25/07/07]
Hello, I sought a little on the Web because this term did not say anything to me, and I found what is probably the last document placed at the disposal by the W3C. it is here http://www.w3.org/TR/CSS2/aural.html. This article introduces aural styles and details the aural properties defined by the CSS 2 specification. It should be noted that the W3C does not give up ACSS in its preparatory for CSS3. http://webdesign.about.com/cs/css/a/aa093002a.htm introduces the aural features new to CSS 2 and gives a general overview of how they work. http://www.htmlcenter.com/tutorials/tutorials.cfm/53/CSS/ provides a general overview, without going into very much detail on what each property does. In parallel I do not know well these attributes CSS which make it possible the software to better do the reading. I hope that somebody will be able to say some to us more because it is one must-have accessibility of today. Good luck and keep us informed ! Sebastien _ Gagnez des pc Windows Vista avec Live.com http://www.image-addict.fr/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Formating problems
My layout seems to work in Firefox and IE7 but early versions of IE are distorting my layout. I would like to make the product photos box the same size as the place your order here box. I am also having trouble fixing the validation errors. http://precisemessenger.com/private/shirttest.html Any help is greatly appreciated. Thanks, Kevin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
