Re: [css-d] Double space after a period
On Mon, 16 Oct 2006 11:11 am, Kathy Wheeler wrote: On 16/10/2006, at 10:30 AM, michael ensor wrote: As someone who worked as a proof reader on a morning newspaper in the hot metal days, I can tell you that the double space after a period was a function of the typesetting machines, because the full stop slug and the following capital letter 'created' that appearance, not some received style guideline. Interesting. However I seem to remember that my mother, who was trained as a secretarial typist just after WW2, was meticulous about using double spacing after the period. This was with old fashioned mechanical typewriters and paper in an office situation. Nothing to do with press or pre-press. IMHO although unnecessary it may be, double-spacing after the period does improve the legibility and feel of typography. It would be nice if there were some simple way, with CSS perhaps, to allow for double spacing for those who cared, without affecting those who don't give a hoot. Cheers, KathyW. IMHO, the only reason that the double spacing appears in US based material is because of the standard font point size used in the US. Standard font sizes used in the rest of the world are larger and more easily read than the dense 10 pt preferred in the US. As Michael has correctly pointed out the illusion of a second space in hot metal typesetting was the positioning of the full stop (and other punctuation if I remember correctly from my print estimator days) towards the left of the metal slug and not central like all the other characters. Heavy text sites should be encouraged to use slightly larger fonts and more white space to make the page/screen more readable. Quality over quantity always wins :-) -- Regards, Steve Bathurst Computer Solutions URL: www.bathurstcomputers.com.au e-mail: [EMAIL PROTECTED] Mobile: 0407 224 251 _ ... (0) ... / / \ .. / / . ) .. V_/_ Linux Powered! Registered Linux User #355382 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Can someone explain to me why Tidy gives the following warning: - Warning: img attribute width has invalid value 74px - Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. Thanks, Patti --- [TotalNet (www.totalnet.us) has scanned this E-mail for viruses using Declude Anti-Virus] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Search Form Box Over Graphic
Lidia-Anain Bjorkquist wrote: But I am still having trouble figuring out how to correctly place a search box to line up just right with the graphic. I would also like to use another graphic as the go button but cannot seem to do that right either. www.zenlovejoy.net You can use absolute positioning for such a size-limited element, and it will turn out fine in most cases and most browsers. However, you must make it position relate to the page - not to the screen. Adding this... #bigbox { position: relative; /* that's your page */ } .searchbox { left: auto; /* or simply delete existing 'left' */ right: 6px; top: 50px; } ...will stabilize the position. --- Looks like you're mixing XHTML 1.0 syntax into a HTML 4.01 document. img usemap=#logomap / ...should be written as... img usemap=#logomap ...in 4.01. Correcting such things will eliminate most validation-errors. --- Suggestions: Adding... #content p {padding: 0 3px;} span.window {margin: 0 3px 3px 0;} ...may line up paragraphs a little better IMO. The 'span.window' styles can probably be moved onto the image, and the span be removed. Also: you're using a lot of span as inline-wrappers. Looks like valid use, but it is probably not necessary to use such inline-wrappers in most cases. Try using headlines: h1 - h5 where appropriate. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE Rendering Bug?
Sorry about the slow reply; I haven't been able to get online all weekend. I fear you've misinterpreted the problem (or I worded the original post badly, which is more likely :). The CSS works fine; there is no problem with the page I'm using. The example I gave previously was the bare minimum markup and CSS to recreate this rendering bug (I'm calling it a bug, for simplicity's sake). The last option tag on the page contains only asterisks, and you can see in the screen shot (and hopefully the example, in IE) that these asterisks are rendered *outside* of the select box, in addition to being rendered correctly inside it. Furthermore, interacting with these extra asterisks has the same consequences as interacting with the option tag itself, proving that the two are one and the same element. I was just curious to know if this issue (drop down contents appearing elsewhere on the page in IE) has been raised before, and if not, to point it out. So, has anybody seen this bug 'in the wild'? I need to know or it'll be irritating me all week ;) Cheers, Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Shining examples of CSS-driven nonprofit corporate sites?
Hi Tim, FWIW, you might want to look at one of the sites I maintain, http://www.beiresources.org. BEI Resources is a not for profit organization. The site fits within your criteria. regards, larry -- Larry C. Lyons Web Analyst BEI Resources American Type Culture Collection http://www.beiresources.org email: llyons(at)atcc(dot)org tel: 703.365.2700.2678 -- On 10/16/06, Tim Ware [EMAIL PROTECTED] wrote: -- Message: 4 Date: Sun, 15 Oct 2006 11:21:38 -0700 From: Tim Ware [EMAIL PROTECTED] Subject: [css-d] Shining examples of CSS-driven nonprofit corporate sites? To: CSS Discuss css-d@lists.css-discuss.org Message-ID: [EMAIL PROTECTED] Content-Type: text/plain; charset=US-ASCII; delsp=yes; format=flowed I'm working on a project where I'm doing the coding/programming for a company that has hired a designer who is really print-based and doesn't have a clue about modern design. They ask that I provide examples of this approach to design. I need help with this. It's not as easy as I thought to find good examples, but I'll bet y'all can point me to some. Thanks! Tim . ! . Tim Ware .. HyperArts .. 201 4th Street, Ste 404 .. Oakland CA 94607 t: (510) 339-6084 .. f: (510) 339-6086 .. e: [EMAIL PROTECTED] http://www.hyperarts.com Map -- The real problem is not whether machines think but whether men do. - B. F. Skinner - __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Double space after a period
I've looked around for a stable solution which doesn't involve putting nbsp, emsp; etc all over the content (that's presentational :-) ) and can only come up with using the old s tag (for strikeout): s{ padding-right: 1em; text-decoration : none; } then, blah blahs./sblah blah. It seems to work, but I'd be grateful if someone could check it in odd browsers such as Lynx (Rene?). You can see a working test here: http://www.rhh.myzen.co.uk/rhh2007/locations/constantine/doublespace.html Note: it needs a trans doctype if it's to validate . . . Thanks. -- Best Regards, Bob McClelland Cornwall (UK) www.gwelanmor-internet.co.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Remove frame borders through CSS
Hi, I'm building a site using frames, and if I use the property border=0 in the frame tag, because it doesn't validate. I'd like to know how can I achieve the same effect through CSS. Thanks! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Weird :hover problem in IE
Hi all on this great list, http://www.bluelink.net/zaprirodata/test.shtml See left nav. FF 1.5 is OK. IE 6.0 - some items in the static menu on the left OVRLAP the second menu (UL) wheh hovered. Also, if you hover the THIRD FROM THE TOP menu item on the left, you'll see also that the title THIS IS TEST TITLE in the middle column is ALSO overlaped. I have tried z-index, nope. To prevent the hasLayout bug, I think also that almost everything on this page has at least a stated width or height. Any ideas how to make the HOVER UL menu to behave in IE as it should?... :-) Thx, Michel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Double space after a period
On Oct 13, 2006, at 4:40 PM, Austin, Darrel wrote: Is there a way in CSS to turn a single space after a period into a double space - without using nbsp; (the no break HTML code)? The drawback to using nbsp;, besides having to type it in, is that if a sentence in the middle of a paragraph starts on a new line, that line is indented by a space, which throws off the look of the whole paragraph. With CSS? No. And while you could do it server side or via javascript, you'd still run into the issue you mention where you could get the odd indent. FYI, you shouldn't be doing this anyway. Most agree that it's not proper typography (though there's a few hold-outs...namely High School English teachers...) http://en.wikipedia.org/wiki/French_spacing Anything I read in wikipedia is, by definition, suspect. So instead I decided to get out my tools and do some research. I selected some books and magazines from my library and measured. The books came from several fields, including but not limited to web design, theology, woodworking, and writing, and all from different publishers, just to be sure that the preference of one field or publisher wouldn't skew the data. In most of the books, there was very little detectable difference between the space after a period and the space between words on the same line (I add that qualifier, because most of the typography in the books was justified, hence the spacing would vary from line to line). The interesting variable here is that the writing book (and The Writer magazine, which I also tested) had a slightly larger space after the sentence, though nothing as large as twice the space between words. The data tends to indicate a preference for single spacing exists among publishers, people who should be aware of readability issues. John Rhodes (ACM SIGCHI [Special Interest Group for Computer - Human Interaction]) wrote there was no empirical evidence that either method was better than the other (people tended to skip over spaces, regardless of length). Meaning neither side of this position gets to play the improves readability card. So the question boils down to one of aesthetics. Personally, I dislike the extra space. My eye tends to get lost when it encounters the extra space, and it annoys me when I encounter it. But I freely admit this is simply anecdotal, and other people may have other reactions. So the choice of one or two spaces is personal taste. Now, how to accomplish it? It's possible, through regular expressions, to add nbsp; as content after every period in a paragraph. But that brings us to some interesting problems, which will exist in any sort of automated approach. I think the problems make it impractical, so I don't include a sample expression because of that. To do it properly requires the ability to understand what a sentence is, or at least recognize one when seen, which most web editing software cannot do reliably. The first obvious problem is what about sentences that don't, in fact, end in a period? (The previous sentence is a great example, but there are more insidious ones.) I suppose you could do the same for all punctuation marks that end a sentence, but even then you're not finished. I can hear someone in the back of the room asking what about sentences that end with quotation marks? (Note how smoothly I worked that example in.) Quotation marks are supposed to come after the punctuation, but often they reside inside a sentence, so they will cause problems for any automated insertion. (As any alert reader may have already noticed, parentheses also fit this category, as you'd want to add the two spaces after the closing paren, not between it and the period.) I think there are enough exceptions (abbreviations create periods that don't end sentences, to name another) to cause insurmountable problems for any automated insertion; probably the best method is to type the two spaces, then before finishing, do a global search and replace for double spaces into an entity or combination of entities. (I'd probably start with the numeric entity 8195, the emspace.) This thread also contained an unfortunate comment dismissing the problem a screen reader had with the nbsp entity as just a bug in the screen reader, therefore not the designer's problem. I wonder if the commenter takes the same attitude to browser bugs. So what if IE/ Firefox/Safari can't display this properly. That's a bug in the browser so It's not my problem! Some have brought up style guides as authorities. I suspect you can pile up the references to an equal depth on both sides. MLA and Chicago both officially say one space after a period. (I mention this only because one commenter claimed Chicago says two spaces, so I'll adduce the URL: http://www.chicagomanualofstyle.org/CMS_FAQ/ OneSpaceorTwo/OneSpaceorTwo02.html) Chicago also says some people prefer
[css-d] Large gap
URL: www.objectivedesigns.com If you go to the photography page and scroll about 2/3 of the way down through the photo thumbnails, you'll see that in IE6, there's a big gap of emptiness. Any idea why this is happening? Thanks in advance. Daniel Hammond www.objectivedesigns.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Using Dreamweaver with standards-based websites?
I work as a web manager for a smallish nonprofit. Though I'm the primary keeper of the site, there are a number of others in the org that edit it. Dreamweaver is the program that everyone's familiar with, so that's what we use. In my spare time, I've been redesigning the homepage with CSS - I want so badly to switch from our table based layout to something that I can actually understand. All of my redrafting has been done by handcoding. I didn't think twice about the fact that it looked like crud in Dreamweaver MX, as I'm aware that its support for CSS is extremely weak. Well, I finished a draft last night, and having heard that Dreamweaver 8 had far stronger CSS support, I started getting excited. If Dreamweaver 8 made my redraft editable in design mode, maybe I could sell this to everyone else who works on our site. I downloaded the trial version of Dreamweaver 8 and.no dice. The page is every bit as fractured in design mode in 8 as it was in MX. Is all hope lost? I won't be able to get approval for reworking our website with a CSS layout unless there's some program out there that would let people make simple WYSIWYG edits. Is there another editor out there that might work? Is there a setting in Dreamweaver that I'm just missing? Or am I just SOL? Thanks for your help! Matt __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] ADMIN: Double space after a period
Pardon me, I'd just like to step in here to point out that css-discuss is not for arguments about typographical preferences. It exists to help people understand how to use CSS to do what they want to do, or else to understand why it's difficult or impossible to do so. There have been some suggestions for Chris, which he is now free to take or leave. Telling him that what he wants is wrong doesn't help anyone. (And yes, this is true for everything. Even if someone says I want to prevent the user from changing the text size, it does no good to tell them they're wrong to want that. It does a world of good to explain why that isn't in any way possible, because then they learn something about the medium.) The people who suggested 'white-space: pre' were on to something, but as others pointed out, that prevents any word-wrapping. So what Chris really needs is a setting that preserves whitespace while allowing word-wrapping. Et voila: p {white-space: pre-wrap;} This combines the whitespace preservation of a 'pre' element with the word-wrapping of a non-'pre' element. See http://www.w3.org/TR/CSS21/text.html#propdef-white-space for somewhat confusing details. Or, if you have a copy, hit up pages 151-152 of the second edition of my O'Reilly book. The table on page 152 is missing a value ('pre-line') but that's something I hope will be corrected in the forthcoming third edition. As for browser support, here's a test page: http://meyerweb.com/eric/css/tests/white-space.html The verdict: pretty much nobody supports it, so it's a great idea but is currently of no practical value. So we're left with the suggestions that were seen earlier in the thread, most of which involve structural hacking of one type or another. Let's keep things moving in the direction of finding solutions, or else drop the thread. Thank you. -- 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 IE7b2 testing hub -- 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 Dropdown Menu and Safari 2.0
I have a test case for Safari 2.0: http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/test_case.asp Sub-menus stay open and the workaround I found fixes all sub-menu but the last one. Note that on the page where I'm using the workaround, trying to reach the top item at the left of the sub-menu on a diagonal path from the top left corner of the sub-menu does the same thing. Is this a known bug? And if it is, what's the best way to fix it? --- Regards, Thierry | www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Necessity of width and height attributes within img
Good afternoon, The Government of Canada is rolling out its next iteration of guidelines that governmental departments must adhere to, and I'm just in the process of writing up a constructive critique. One of the things I would like to see is height and width removed from image tags and instead be defined in the CSS. I have a number of recurring icons throughout my sites, and in the past I have been able to change the icons by simply overwriting the old version with the new one and updating the dimensions in the CSS accordingly. However, some other developers are leery of leaving them off. Are there any drawbacks or best practices I should know about? Regards, Chris Hardie DEAIS 3-6-C Dept of National Defence __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Bottoms up
A website I am working on has a glitch and I cannot figure out why it is happening. http://www.livingwaterhealthsolutions.com The top navigation in the upper right corner (see code below) is the location of the problem. ul class=topMenu lia href=#contentsSkip to Content/a/li lia href=siteMap.htmlSite Map/a/li lia href=http://www.livingwaterhealthsolutions.com;Search Site/a/li /ul In Internet Explorer (not in Opera, Netscape nor Mozilla) when the mouse gets close to this top navigation, the footer moves up the page. The mouse has to be moved back down for the footer to move back down. I have removed the footer and removed the return to top trying to isolate the culprit causing the problem. When I removed the above topMenu the problem no longer existed. But that doesn't really solve the problem as we don't want to remove the navigation. I have used the very same format on another website, and it does not act up at all. Does anyone know why this is happening in IE and if there is a way to fix it? Thanks. Joan _ Stay connected with the news, people, places and online services that matter to you on Live.com http://www.live.com/getstarted.aspx?icid=T001MSN30A0701 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE 6 div disappears in absolutely positioned element
I'm trying to make a container position absolutely inside a relative positioned container. This is making the absolute positioned element disappear in IE 6. example (3 images should show up bottom right): http:// www.westga.edu/assets/tmp/testCss/ I'm sure this is a well documented bug, but for some reason, I can't figure out which one. I would be very grateful for someone to point me in the right direction. Thanks, Madison __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Newbie question re: viewing css-d messages
I have not visited css-d for a long time and I see that it is now on a new message board. Where do I go to view the list messages? I can see my account settings at http://lists.css-discuss.org/mailman/listinfo/css-d The PUBLIC link lists the lasts 40 messages with a date of 2005 though they do seem to be this year's messages. I can view the archived messages at http://lists.css-discuss.org/mailman/private/css-d/ Or are the current messages not on-line any more? Or am I just thicker than usual. Thanks in advance jean korte __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] CSS shapes
Gabriele Romanato wrote: a little tribute to Tantek and Mark Schenk. enjoy! Fun! Hehe. I like it. Maybe for your next version you could add some colors? These links may help inspire you to create more: http://cssplay.co.uk/menu/cssart.html http://www.tanfa.co.uk/css/borders/ ( About tanfa: a site by SuzyUK. She is admin for the CSS forums found here: http://www.webmasterworld.com/css/ ) I really enjoy out-of-the-box thinking. Keep up the good work. Cheers! :D Micky -- Wishlist: http://snipurl.com/vrs9 Switch: http://browsehappy.com/ BCC?: http://snipurl.com/w6f8 My: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Active/Focus trouble
Hi folks! I have a simple question about the link, visited, hover, active and focus pseduoclasses. Everything works fine up until I get to the active tag. If a visitor is on (say) the Home page, I want the Home link to be high-lited. Since the w3schools page describes the active pseudoclass as/* selected link */ , it appears to me that it should be the link currently in use. Maybe the active pseudoclass doesn't do that, but then I fail to see what the point of it would be. (Nor did I see anything in the css-discuss wiki.) Here's the relevant code. Maybe one of you fine folks will see what I've done wrong. a:link{color:#fbd012; font-weight:700;} a:visited{color:#b5d8f8; font-weight:700;} a:hover{color:#cd5c5c; background:orange; text-decoration: underline overline; font-weight:700;} a:active{color:#cd5c5c; background:orange; text-decoration: underline overline; font-weight:700;} a:focus{color:#b5d8f8; background:orange; text-decoration: dashed; font-weight:700;} If I've done something wrong in the above, just hit reply now because you won't need to see the rest. Below this is where I work through what I've been trying to do. a:link{color:#fbd012; font-weight:700;} [This should make links a certain color and bold, right?] a:visited{color:#b5d8f8; font-weight:700;} [Visited links should be a certain color and bold.] a:hover{color:#cd5c5c; background:orange; text-decoration: underline overline; font-weight:700;} [This makes the links, when hovered over, have an orange background with underline and overline and bold.] Still with me? Everything seems to work as intended until I get to this part. a:active{color:#cd5c5c; background:orange; text-decoration: underline overline; font-weight:700;} [As I've set this up, I want the current page link to show as if it was being hovered over. It doesn't _have_ to be, but it doesn't seem to matter what I put in here. It won't do anything in any of my browsers on any of my computers.] a:focus{color:#b5d8f8; background:orange; text-decoration: dashed; font-weight:700;} [This is residual from testing but has no effect in any of the browsers I've tried either. I thought maybe I needed it to make the active tag work.] So why isn't the link to the active page high-lited orange? I'm sure there's SOMETHING I don't know or am overlooking. If, for some reason, you want to see it in action, it's at http://www.artpatient.com/sod.php and the css file is at http://www.artpatient.com/test.css Thanks! Delos http://www.artpatient.com See the Frog Pond Webcomic, sketches, caricatures and more! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE5 problem with menus: Thank you!
Dear Holly, I have just come back to Australia from Hong Kong, and implemented your solution. On 08/10/06 20:18 -0500, Holly Bergevin wrote: From: Nick Urbanik [EMAIL PROTECTED] The menus here: http://camwest.pps.com.au/ jump about in IE5 Hi Nick, If you'll ammend one of the selectors in your lt IE 7 Conditional comment/style sheet, IE5 should come around. change - #menu ul li a {height: 1%;) to - #menu ul li a, #menu, div#menu li, div#menu li:hover {height: 1%;} (yeah, I added several elements there) Anyway, it worked for me and didn't seem to bother IE6 or IE5.5. Thank you very much indeed! It did indeed fix it. I would like to buy you a beer or the beverage of your choice --- now the web site seems as if it will work with any browser! Thank you. I would love to know *how* you knew that this would work, since my goal includes understanding CSS and how web browsers interact with it. -- Nick Urbanik RHCE http://nicku.org[EMAIL PROTECTED] GPG: 7FFA CDC7+5A77 0558 DC7A 790A 16DF EC5B BB9D 2C24 ID: BB9D2C24 pgpFN1b2myGiZ.pgp Description: PGP signature __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] PROBLEM SOLVED: universal selector horror
Sorry guys but I think I got this one licked. I changed things like body#infoSidebar p { padding: 10px; } to *#infoSidebar p { padding: 10px; } I'm very pleased that it works now but now I'm confused as to why it worked while the first instance didn't. Could anyone shed some light? Thanks, Raymond __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Picture and Background Alignment IE6 and older
j wrote: Header div 150px high containing two pictures each 150px high that need to be aligned with the background top and bottom. The background image is a .png gradient that sizes itself. Looks fine MSIE7, Firefox. On older MSIE6 and older a strip of background is visible under the pictures and the pictures are vertically squashed. The site: http://www.jeankorte.netfirms.com/index.html [...] Hi Jean, At this moment in my IE6 under Win98SE there is no problem with a green background strip under the header images. Also vertically they are perfect in line. But I notice that the width of the images is no good in IE6 at the initial download of the page, or after a refresh. The right image is pushed together, the lady is horizontally extended. See screenshot http://home.tiscali.nl/developerscorner/css-discuss/images/screenshot-indigo.png. To solve by removing the { width: auto; } from the #header img styles. As you have defined the height (150px) of both images in the html, the { height: 150px; } in the #header img styles can be omitted too without giving problems. :-) Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] accessing li ul in suckerfish
I have a page (id=home) inside that page is a header div, inside that is a #menu_holder which holds the version of the suckerfish which I have given all the buttons id's eg. li id=fouumFORUM ul li class=suba href=#Menu Item 1/a/li li class=suba href=#Menu Item 2/a/li li class=suba href=#Menu Item 3/a/li li class=suba href=#Menu Item 4/a/li /ul /li Now I want to adjust the dropdown poition for individual menu items li ul { display: none; position: absolute; top: 6em; width:2em; left: -0px; } am have tried using this #home #header #menu_holder #news li ul { display: none; position: absolute; top: 1.3em; width:2em; left: 160px; } but it does not ssem to work. any Ideas? Ross __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] changing the body
Hi, I have a few pages set up with id's on the body- #home, #about us, the usual stuff, but I want to change body properties for each one. I have tried a few. body { // This just seems to override everything } body #home { //no joy here either } Can someone tell me the correct way to do this. If possible I would like to set some generic properties in body and then individual one depending on the body id. Ta, Ross __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
I want individual body properties depending on the page id. and this is my css #home body { background-image:url(/images/home_bg.jpg); background-position: 0px 200px; background-color:#0033CC; background-repeat:repeat-x; margin:0; font-family:Arial, Helvetica, sans-serif; } nothing appears the background image, the font is the wrong one. It is like it is totally ignoring it. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 please - IE problem......
Hello everyone. Please check this site for me: http://kusile.cojjoconnect.co.za I have a little problem in IE... The dark green header bar (h1 with background color applied) should touch the menu bar, there is a small little annoying gap. Seems like padding is applied to the heading although I specified that it should be 0. It works fine in firefox Here is my CSS: h1 { color: #ff; background: #346e40; height: 50px; } #wrapper { margin: 10px; } #header{ } #main { width: 100%; background: #d2e4bc; } #leftcolumn{ float:left; top: 0; left: 0; width: 275px; } #leftcolumn-header{ height: 50px; background-image: url(/images/kusile/headBarPic.jpg); background-repeat: no-repeat; background-position: left; } #leftcolumn-menu{ background: #fcfadf; } #content{ margin: 0 0 0 275px; background: #d2e4bc; padding 0; } #clear{ clear:both; height: 0; } HTML layout page looks like this: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd; html head titleKusile Publication Services/title %= stylesheet_link_tag 'reset' % %= stylesheet_link_tag 'layout' % %= stylesheet_link_tag 'kusile-fonts' % %= stylesheet_link_tag 'menu' % /head body div id = wrapper div id = header img src=/images/kusile/logo.jpg alt=Kusile Logo / /div!--header-- div id = main div id = leftcolumn div id = leftcolumn-headernbsp/div div id = leftcolumn-menu %= menu % div id=clear/div /div!--leftcolumn-menu-- /div!--leftcolumn-- div id = content %= yield % /div!--content-- div id=clear/div /div!--main-- /div!--wrapper-- /body Is built in ruby so the stylesheet calls are a bit odd. Any help / advice will be greatly appreciated Tx. Pieter __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Bottoms Up
Hi Joan, You've run across, in my opinion, one of the most intractable and frustrating bugs in IE - congrats! While I can't exactly explain why IE does what it's doing (I doubt anyone can...), I can tell you it probably has to do with the background color hover effect that's being applied to the links you mentioned. See, IE redraws the screen when the hover effect is applied, and for a variety of reasons it will calculate lengths incorrectly. These include, but are almost certainly aren't limited to: * A confluence of floats, a parent element with padding, and a background property (like a background color being applied) * Floats with negative margins * Applying both the left and right properties under certain circumstances I also think the problem is related to the peekaboo bug, so you may want to check the fixes here: http://www.positioniseverything.net/explorer/peekaboo.html I had to re-do my CSS for my last site because someone noticed that when a background-color hover effect on my nav menu was triggered, the entire nav column would shift over 10 pixels. I ended up having to remove the padding off the parent element (the body) and muck around with the dimensions of every container element - fun! If you want a quick fix, I think you could simply remove the background-color text effect. Not ideal, I know, but you could probably trigger a text-decoration:underline; instead. HTH, C. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
On 16/10/2006 09:50, Patti Evans wrote: Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. It's because you're using 74_px_. The correct value for the attribute is 74. If you want to use units other than pixels, use a style attribute and specify away. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Patti Evans wrote: Can someone explain to me why Tidy gives the following warning: - Warning: img attribute width has invalid value 74px - Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. No, only CSS takes units - HTML assumes px. So img src=something.jpg width=74 height=10 alt=something is the correct syntax HIH! Lea -- Lea de Groot Elysian Systems Brisbane, Australia __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Height and width for image should be simply numbers as far as I can remember. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
HTML sizing attributes tag have to be plain numbers, with no units; in the case of width and height for images, it is assumed that the value is in pixels. That is, this HTML:: img width=74 ... is equivalent to this CSS version: img style=width: 74px ... Of course, it would be better still to use some other means of associating that CSS style with that element; the less coupled the style with the markup, the better. On 10/16/06, Patti Evans [EMAIL PROTECTED] wrote: Can someone explain to me why Tidy gives the following warning: - Warning: img attribute width has invalid value 74px - Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. Thanks, Patti --- [TotalNet (www.totalnet.us) has scanned this E-mail for viruses using Declude Anti-Virus] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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/ -- Mark J. Reed [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE Rendering Bug?
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of Rob Wilmshurst Sent: 16 October 2006 11:36 To: CSS Discuss Subject: Re: [css-d] IE Rendering Bug? Sorry about the slow reply; I haven't been able to get online all weekend. I fear you've misinterpreted the problem (or I worded the original post badly, which is more likely :). Guess so. I haven't the original page saved as I changed it to make it work. As I said earlier, it didn't work in any of the browsers that I tested it. The test that I have put here: http://www.iyesolutions.co.uk/templates/css/wilmhurst/test2.html does work. You will see that the HTMl is different to what you had, if I remember correctly. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Subject: [css-d] validation Can someone explain to me why Tidy gives the following warning: - Warning: img attribute width has invalid value 74px - Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. Thanks, Patti What doctype are you using? A link to the page would help us see the problem. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Double space after a period
-BEGIN PGP SIGNED MESSAGE- Hash: SHA1 Designer wrote: I've looked around for a stable solution which doesn't involve putting nbsp, emsp; etc all over the content (that's presentational :-) ) and can only come up with using the old s tag (for strikeout): What about just a span with a class, eg: With old printing, there used to be a larger space after the periodspan class=doublespace./span But nowadays that space has disappeared and thus people have started to add 2 spaces after the periodspan class=doublespace./span Note: it needs a trans doctype if it's to validate . . . That way you don't need a transitional doctype. Raoul. -BEGIN PGP SIGNATURE- Version: GnuPG v1.4.2 (GNU/Linux) Comment: Using GnuPG with SUSE - http://enigmail.mozdev.org iD8DBQFFNOQxquTvBX+BiJYRAkmsAJ9NVqSKl+ZM6KpXmKZQaRlHHWtWVwCgy37i BtoNHs/i8tinVJqbjUVuCL0= =Njdd -END PGP SIGNATURE- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Self Clearing Floats Problem?
Subject: [css-d] Self Clearing Floats Problem? Hi All, I'm just about to finish creating the layout for our Christmas site here at work but (as always) I'm having problems in IE 6 and 7 with one of my divs. As you can see between the FF and IE views, my 'pNav' div isn't fully displaying in the IE's. I've got a section of code in my CSS files that deals with clearing floats but this doesn't seem to be working. Another problem seems to be the left hand nav - 'nav' in the master.css file - where there seems to be a margin/padding problem on my 'li a:hover' pseudo class. As I've been looking at the same problem(s) for hours now, I thought I'd open it up to different sets of eyes. The page can be found at http://www.coopintranet.co.uk/xmas and the CSS files can be found at http://www.coopintranet.co.uk/xmas/css/master.css and http://www.coopintranet.co.uk/xmas/css/ie.css I'd be most grateful for any pointers/ideas/suggestions and, above all, fixes! Brett First thing hat I can see is that you have onely defined the li a hover which is why in IE6 it is only the link that is white. Try #nav li hover { background-color:#fff; color:#A9060E; } Cannot see the problem in pnav on my system. IE6/7. FF, Opera. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Remove frame borders through CSS
Subject: [css-d] Remove frame borders through CSS Hi, I'm building a site using frames, and if I use the property border=0 in the frame tag, because it doesn't validate. I'd like to know how can I achieve the same effect through CSS. Thanks! __ Don't want to appear negative, but don't build a site using frames! Search engine hate them and seems a waste of good CSS. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Using Dreamweaver with standards-based websites?
Subject: [css-d] Using Dreamweaver with standards-based websites? I downloaded the trial version of Dreamweaver 8 and.no dice. The page is every bit as fractured in design mode in 8 as it was in MX. Is all hope lost? I won't be able to get approval for reworking our website with a CSS layout unless there's some program out there that would let people make simple WYSIWYG edits. Is there another editor out there that might work? Is there a setting in Dreamweaver that I'm just missing? Or am I just SOL? Suggest that it is CSS not Dreamweaver that is at fault. Care to share your draft with us and we can see what is the problem. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Using Dreamweaver with standards-based websites?
I downloaded the trial version of Dreamweaver 8 and.no dice. The page is every bit as fractured in design mode in 8 as it was in MX. Matt, I've found that complex layouts, involving nested floats and positioned elements, work just fine in Dreamweaver if I get them to work in older Operas (5 or 6), without hacks that is. And that usually just requires trying different ways to do the same thing (padding instead of margin, adding position:relative here and there, etc). YMMV of course, if your layout has hit a DW css bug... __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Large gap
5:55 To: CSS Discuss Subject: [css-d] Large gap URL: www.objectivedesigns.com If you go to the photography page and scroll about 2/3 of the way down through the photo thumbnails, you'll see that in IE6, there's a big gap of emptiness. Any idea why this is happening? Thanks in advance. Daniel Hammond www.objectivedesigns.com Woks fine for me on IE6/7, Opera, FF. 42 pics all there. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE form quirk
Greetings, i'm trying to put a form up on a website i'm working on. In FF it looks fine, but IE is being a b* again. http://www.scoutsheverlee.be/takken/jin/ http://www.scoutsheverlee.be/takken/jin/ IE adds about 10-20 pixels of extra background to the top of the fieldset, and for the life of me i can't figure out why. More so because i simply copied the form code from 'css mastery'. How do i get rid of it ? the css file resides at: http://www.scoutsheverlee.be/css/main.css thanks in advance __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Large gap
| URL: www.objectivedesigns.com | | If you go to the photography page and scroll about 2/3 of the way | down through the photo thumbnails, you'll see that in IE6, | there's a | big gap of emptiness. Any idea why this is happening? | | Woks fine for me on IE6/7, Opera, FF. | 42 pics all there. Well this is strange. In a good way though. The problem seems to have fixed itself. BUT, there are still problems with my new site: www.objectivedesigns.com/2/photography.htm. If this one doesn't choose to magically fix itself before you guys get a chance to take a look at it, you should see what's going on there (tested in firefox, opera, and IE 6 and 7. FF and opera display correctly, but the IE's are the ones that show the problem). Daniel Hammond www.objectivedesigns.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] universal selector horror
* Raymond Rodriguez wrote: It's supposed to look like this in the end but I've not been successful in my attempt at assigning selectors to the body. There is a container on the right-hand side that I named #infoSidebar (line 73 in the CSS file) and I attempted to assign it universally to the body selector since it's going to be there (same size and major attributes) on every page but none of this seems to do anything. body#infoSidebar matches body id='infoSidebar'. It seems what you have is more like bodydiv id='infoSidebar'... in which case you need to use body #infoSidebar, body #infoSidebar, body div#infoSidebar or similar. -- Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de 68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Remove frame borders through CSS
I know what you mean, but this time I have no choice, I'm working on a system that already uses frames, and I can't avoid them. I'm trying to validate the code, and frameset border=0 is not valid. On 10/17/06, Ian Young [EMAIL PROTECTED] wrote: Subject: [css-d] Remove frame borders through CSS Hi, I'm building a site using frames, and if I use the property border=0 in the frame tag, because it doesn't validate. I'd like to know how can I achieve the same effect through CSS. Thanks! __ Don't want to appear negative, but don't build a site using frames! Search engine hate them and seems a waste of good CSS. Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 16/10/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Necessity of width and height attributes within img
2006/10/16, [EMAIL PROTECTED] : Good afternoon, The Government of Canada is rolling out its next iteration of guidelines that governmental departments must adhere to, and I'm just in the process of writing up a constructive critique. One of the things I would like to see is height and width removed from image tags and instead be defined in the CSS. I have a number of recurring icons throughout my sites, and in the past I have been able to change the icons by simply overwriting the old version with the new one and updating the dimensions in the CSS accordingly. However, some other developers are leery of leaving them off. Are there any drawbacks or best practices I should know about? Good afternoon, CMS are necesseraly used by governmental departments. IMHO, the major drawback of your solution would be to prevent users of such tools to choose the size of the image they wish to include in a page (thanks be to God, CMS users cannot modify a style sheet...) This solution might be good in many cases, but a disaster in some other situations. Amitiés -- Philippe DE MOURA phdm __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Patti Evans wrote: Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. The (X)HTML width-attribute for the img-element is 'px' by default, so we don't write 'width=74px', just 'width=74'. So, Tidy warns correctly, AFAIK. We can write 'width=74%', if percentage is what we want. Other units won't work... defaults to pixels in some browsers, while others simply ignore the entire attribute. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Double space after a period
I've looked around for a stable solution which doesn't involve putting nbsp, emsp; etc all over the content (that's presentational :-) ) and can only come up with using the old s tag (for strikeout): s{ padding-right: 1em; text-decoration : none; } Strikeout implies something specific. This isn't a semantic issue, merely stylistic. As such, I'd use a span tag instead. -Darrel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Bottoms Up
Subject: Re: Bottoms Up Date: Tue, 17 Oct 2006 09:15:57 -0400 From: [EMAIL PROTECTED] To: css-d@lists.css-discuss.org CC: [EMAIL PROTECTED] Hi Joan, You've run across, in my opinion, one of the most intractable and frustrating bugs in IE - congrats! While I can't exactly explain why IE does what it's doing (I doubt anyone can...), I can tell you it probably has to do with the background color hover effect that's being applied to the links you mentioned. See, IE redraws the screen when the hover effect is applied, and for a variety of reasons it will calculate lengths incorrectly. These include, but are almost certainly aren't limited to: * A confluence of floats, a parent element with padding, and a background property (like a background color being applied) * Floats with negative margins * Applying both the left and right properties under certain circumstances I also think the problem is related to the peekaboo bug, so you may want to check the fixes here: http://www.positioniseverything.net/explorer/peekaboo.html I had to re-do my CSS for my last site because someone noticed that when a background-color hover effect on my nav menu was triggered, the entire nav column would shift over 10 pixels. I ended up having to remove the padding off the parent element (the body) and muck around with the dimensions of every container element - fun! If you want a quick fix, I think you could simply remove the background-color text effect. Not ideal, I know, but you could probably trigger a text-decoration:underline; instead. HTH, C. Thank you very much! I went for the simple way and removed the hover background and all is fine. I thank you for the education on this bug also... something I may need to know one day. I appreciate your help! Joan _ Share your special moments by uploading 500 photos per month to Windows Live Spaces http://clk.atdmt.com/MSN/go/msnnkwsp010001msn/direct/01/?href=http://spaces.live.com/signup.aspx __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
* [EMAIL PROTECTED] wrote: I want individual body properties depending on the page id. and this is my css #home body { This matches ... id='home'body You probably want to match body id='home' which is body#home { ... } or just #home { ... } -- Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de 68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Using Dreamweaver with standards-based websites?
Matt Dawson wrote: snip I downloaded the trial version of Dreamweaver 8 and.no dice. The page is every bit as fractured in design mode in 8 as it was in MX. Is all hope lost? I won't be able to get approval for reworking our website with a CSS layout unless there's some program out there that would let people make simple WYSIWYG edits. Is there another editor out there that might work? Is there a setting in Dreamweaver that I'm just missing? Or am I just SOL? Dreamweaver handles some CSS layouts better than others. Negative margins almost always give me trouble, for example, but I've had good luck with a lot of the layouts from positioniseverything.net. If you're going for something relatively standard, like 2 or 3 columns with a header and footer, try downloading a handful of sample layouts from the usual suspects and see what works. If you have a minute, let Adobe know what kind of layout you were trying to use: http://www.adobe.com/cfusion/mmform/index.cfm?name=wishform They do pay attention to that form -- or at least Macromedia did; I presume there's still someone listening on the other end. Filing a bug report won't solve your immediate problem, but it might lead to better support in DW9. -- Stephanie Leary Web Communications Specialist Texas AM University System http://tamus.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
Sure it is, you have the id before the body, it should be body #home. Otherwise the rule is ignored and you get the default styles. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
From: [EMAIL PROTECTED] Sent: Tuesday, October 17, 2006 5:31 AM I want individual body properties depending on the page id. and this is my css #home body { background-image:url(/images/home_bg.jpg); background-position: 0px 200px; background-color:#0033CC; background-repeat:repeat-x; margin:0; font-family:Arial, Helvetica, sans-serif; } nothing appears the background image, the font is the wrong one. It is like it is totally ignoring it. This will work (in some browsers) if you the element containing your body tag has an ID of home html id=homebodyYour styles applied here/body/html Please note I don't know if you can attach an ID to the HTML element, and if so, which browsers support it. Try htmlbody id=homeSome HTML/body/html body#home { // Your attributes here } HTH. --G __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] ADMIN: Double space after a period
Thank you for your concern, but I have a solution, it takes into account all the issues that Arlen brings up (handles question marks, and other characters, as well as quoted strings -- single or double, etc.), and gets the effect I want. I presented it a couple of days ago. The original questioner was Ted, who I'm sure has long since been scared off by all the bickering about what's right. Chris From: Eric A. Meyer [EMAIL PROTECTED] Subject: Re: [css-d] ADMIN: Double space after a period So what Chris really needs is a setting that preserves whitespace while allowing word-wrapping. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Necessity of width and height attributes within img
All the height/width really does is set up a block of space that browser knows is being used by the image, for the most part it can stay or go. I couldn't find the page @ w3c.org but 23schools.com has height and width both listed as optional attributes, with the only required ones being src and alt. [EMAIL PROTECTED] wrote: One of the things I would like to see is height and width removed from image tags and instead be defined in the CSS. I have a number of recurring icons throughout my sites, and in the past I have been able to change the icons by simply overwriting the old version with the new one and updating the dimensions in the CSS accordingly. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] A Problem and a Question About This Sample Page...
I wanted to post this sample page so that I can get some valuable feedback. This is just a sample page- a template in its beginning stages. As far as this page is concerned, I wanted to know: 1) I have space between the third column on the right and the picture that will be in the center. I wanted this column FLUSH with the picture (which is enclosed in a div along with the left-hand column). The left-hand column is flush with the picture but the right is not. Furthermore, there is a difference in the amount of space there is between the two elements from IE to.Firefox, which are the two browsers I am testing with right now. What could be causing the difference? And is there a better way to set up a three-column layout for this page other than wrapping the first two columns in a div and floating the third column to the right of that div? 2) I was informed on this mailing list before about layering style sheets. I've been adding rules to and taking rules out of the three style sheets attached to this sample page. I've done a little research on this subject but I wanted to know if anyone uses this technique and if they have any advice for me as to how to use it effectively. HTML: http://www.accd.edu/spc/distance/test/sample.html Stylesheets: http://www.accd.edu/spc/distance/test/core2.css, http://www.accd.edu/spc/distance/test/home2.css, http://www.accd.edu/spc/distance/test/elements2.css ___ Rodney Toliver Senior Multimedia Specialist St. Philip's College- Instructional Technologies 1801 M. L. King Drive San Antonio, Texas 78203 (210) 531-4631 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Using Dreamweaver with standards-based websites?
Matt Dawson wrote: Is all hope lost? I won't be able to get approval for reworking our website with a CSS layout unless there's some program out there that would let people make simple WYSIWYG edits. Is there another editor out there that might work? Is there a setting in Dreamweaver that I'm just missing? Or am I just SOL? In Dreamweaver, look into design-time stylesheet. HTH, --- Regards, Thierry | www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
[EMAIL PROTECTED] wrote: I want individual body properties depending on the page id. If you mean a unique look for individual pages in a site, then you'll probably want to use a body id. This article explains how to do this: http://www.maxdesign.com.au/presentation/page-id/ Regards, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Menu
I want to create a menu similar to the one that appears when you hover over the Services link that appears in the left navigation of this page (www.dukehealth.org). I know it is being done by styles, but I have no clue of how. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Necessity of width and height attributes within img
[EMAIL PROTECTED] wrote: One of the things I would like to see is height and width removed from image tags and instead be defined in the CSS. I have a number of recurring icons throughout my sites, and in the past I have been able to change the icons by simply overwriting the old version with the new one and updating the dimensions in the CSS accordingly. The presence of HTML width/height attributes don't prevent us from changing image-dimensions through CSS, so there's no conflict between HTML attributes and CSS here. Those HTML attributes can also be left out at will, so I simply can't see any problems in keeping them in some guidelines - unless those guidelines are saying that those attributes *must* be used in a certain way, which deviates from standards. However, some other developers are leery of leaving them off. Are there any drawbacks or best practices I should know about? I have noticed a few browser-bugs that may disturb layouts where images have no declared dimensions. Other than that there's only those rare cases where images are resized in CSS, and the user for whatever reason turns CSS off... regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] margin problem
Hi all, I am working on a fully css based form and for some reason IE is removing 5px (approx.) from the left margin on a fieldset tag… You can see this here: HYPERLINK http://www.tibbits.ca/webdev/form.phphttp://www.tibbits.ca/webdev/form.php It is the first “Select One” box that doesn’t have the correct left margin. Is there a way to fix this without resorting to hacks to feed IE a wider left margin? Thanks, Matt -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 10/16/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] body properies
or in browsers that support it: body [id=home] Bjoern Hoehrmann wrote: This matches ... id='home'body You probably want to match body id='home' which is body#home { ... } or just #home { ... } __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Necessity of width and height attributes within img
2006/10/17, Mark J. Reed: The reason it has long been recommended to include width and height attributes in image elements is to assist the browser in rendering the page. (...) Modern browsers are quite adept at shuffling things around on the page after the initial rendering, so my vote would be to leave off the width and height specifications entirely. Mark, You are right, modern browsers don't really need the size of the images in pixels, but don't forget that the width and height of images are not nesseraly given in pixels. It can be, for instance, expressed in ems or in % (of the width of its container), Example, look at: http://www.htmldog.com/articles/elasticdesign/demo/ the first image on his page has: img alt=Elastic image src=icicles.jpg class=image id=image1 in the stylesheet: .image { width: 30em; height: 15em; margin: 0 2em 1em 2em; border: 1px solid #ccc; } The size of the image will change with the default size of your font. You could also have something like: .image { width: 90%; height: auto; } There is no other way to tell the brother what to do here. You do need to specify at least a width or a height either in the style sheet or in the source of your HTML document. Regards -- Philippe DE MOURA phdm __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] ADMIN: Double space after a period
* Eric A. Meyer wrote: p {white-space: pre-wrap;} As for browser support, here's a test page: http://meyerweb.com/eric/css/tests/white-space.html The verdict: pretty much nobody supports it, so it's a great idea but is currently of no practical value. So we're left with the suggestions that were seen earlier in the thread, most of which involve structural hacking of one type or another. http://www.w3.org/StyleSheets/Mail/message.css uses: pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+; ... */ } This will, of course, make the style sheet invalid. -- Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de 68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] mock-up help
Hi guys, I've been given a template to build a contact/poll form with. Without giving out too much info, I made a quick mock up on my personal file server: http://hondaswap.com/files/template.jpg The curvy line will be even (i just can't draw), so I'm probably going to take the top 100px or so (1 full sin curve of the wave if you will) and repeat it down on a wrapper div thus making the nice separator. Within that div, 2 nested divs, floated left, one for the questions, and one for the address info. and a clearing element at the end. *What's throwing me off are the stars.* They have randomly placed stars/flowers around the questions as in the example I've linked above in random sizes (images, not shapes) What's the best way to get these in there? I'm trying to avoid absolute positioning as this will be a fluid-width design, and wrapping on the questions for smaller resolutions will throw it all off. Thanks __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Remove frame borders through CSS
On 10/17/06, Bernat Lleonart [EMAIL PROTECTED] wrote: I know what you mean, but this time I have no choice, I'm working on a system that already uses frames, and I can't avoid them. I'm trying to validate the code, and frameset border=0 is not valid. If you want to do it in the HTML, you can;the spec just makes you specify borders on the individual frame elements instead of on the frameset as a whole (which does give you more control): frame frameborder=0 ... But you might as well do it just once with CSS instead. -- Mark J. Reed [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] margin problem
I seem to have found a solution...if I put display: inline; on the my fieldset tag then it lines up properly... Matt I am working on a fully css based form and for some reason IE is removing 5px (approx.) from the left margin on a fieldset tag… You can see this here: HYPERLINK http://www.tibbits.ca/webdev/form.phphttp://www.tibbits.ca/webdev/form.php It is the first “Select One” box that doesn’t have the correct left margin. Is there a way to fix this without resorting to hacks to feed IE a wider left margin? -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.408 / Virus Database: 268.13.4/477 - Release Date: 10/16/2006 __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Bottoms up
Joan Justifiably Jotted... A website I am working on has a glitch and I cannot figure out why it is happening. http://www.livingwaterhealthsolutions.com The top navigation in the upper right corner (see code below) is the location of the problem. (snip, slash) In Internet Explorer (not in Opera, Netscape nor Mozilla) when the mouse gets close to this top navigation, the footer moves up the page. The mouse has to be moved back down for the footer to move back down. I have removed the footer and removed the return to top trying to isolate the culprit causing the problem. When I removed the above topMenu the problem no longer existed. But that doesn't really solve the problem as we don't want to remove the navigation. Joan, here's another problem you have. See my screenshot at http:// www.pierceartanddesign.com/pages/testshots.html and notice what's happening with the header image. It shows that way in Safari 2.0.4. Firefox doesn't cut off quite so much of the phrase, Natural Healing Health Solutions, and Opera cuts off a bit more. Netscape looks good, as does IE/Mac, but (if you care about IE/Mac) there's another oddity...when I mouse over the Home button, but not actually over the word home, the Services button changes to hover mode; when I hover over the box for About Us, before hitting the actual text, the Products button changes to hover mode; this activity continues all the way down the line. But wait there's more! When I hover about two inches to the left of the Home button, just about under the N in Natural, the Home button goes to hover mode. Move over to about 1inch away, under the H in Healing, and the About Us button goes to hover mode. And the Services button goes into hover mode at the first water droplet the the left of the Home button. Now, that's just plain wierd! Sorry I can't give you any suggestions on this one...I'm a rank beginner...but I'm sure the geniuses on this list can help you out. Regards, Dave __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] horzontal CSS menu with tooltips
Bob asked, Baffled: I have a request to create a horizontal drop-down menu with tooltips over some of the menu items. (cut, snip, slash) The menu button links all point to the # index file. The test page is at www.dottedi.biz/codesamples/hmenu/ . If there is too much going on, I can set up a simpler example not mixing CSS and JS. Ideas? Bob, just another glitch, this time in Safari 2.0.4: When I mouse over the Take a peek menu, (which in Safari does not show the word Testimonial but does show the word Javascript _before_ mousing over it) the drop down menu places the word Javascript directly over the word Testimonial, thus obliterating each for readability. Then, when I move the mouse down over the two jumbled words, the word Testimonial disappears, and the word Javascript is visible. The tool tip follows my mouse around on that particular button. Testimonials is basically unreadable, and unclickable at any time. Since I'm not a Javascript-er, and a beginner at CSS, I can only suggest that one of the List Geniuses can help. Best Regards, Dave __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Thanks Lea. I'll remove the px from the HTML and no longer go crazy! Lea de Groot wrote: Patti Evans wrote: Can someone explain to me why Tidy gives the following warning: - Warning: img attribute width has invalid value 74px - Aren't img width and height supposed to be given in px? Could it be because the image is wrapped in a tags? The other images on my page don't get the warning. No, only CSS takes units - HTML assumes px. So img src=something.jpg width=74 height=10 alt=something is the correct syntax HIH! Lea --- [TotalNet (www.totalnet.us) has scanned this E-mail for viruses using Declude Anti-Virus] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] PROBLEM SOLVED: universal selector horror
On 10/17/06, Raymond Rodriguez [EMAIL PROTECTED] wrote: Sorry guys but I think I got this one licked. I changed things like body#infoSidebar p { padding: 10px; } to *#infoSidebar p { padding: 10px; } I'm very pleased that it works now but now I'm confused as to why it worked while the first instance didn't. Could anyone shed some light? spaces have meaning in CSS. unless you were trying to style body id=infoSidebar, your first attempt woul not have selected anything: foo#bar selects an element foo with an id of bar foo #bar selects any element which is a descendent of foo with an id of bar so if you have body div div id=infoSidebar pboo!/p /div /div your div infosidebar is a descendant of body (but not its direct child) The * is unnecessary in your second example. -- Richard Grevers, New Plymouth, New Zealand Hat 1: Development Engineer, Webfarm Ltd. Hat 2: Dramatic Design www.dramatic.co.nz __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] swf priorities over css drop down menus
Good Afternoon, I am new to the list so I apologize in advance if I what I need help with is redundant. I searched the archive for my problem, but had no luck. The site that I am working on has css drop down menus in it and I just put in an swf file that is beneath the menus on the page. In FF/Mac it looks great. Internet Explorer loads everything just great, but when you roll over the menus the items in the drop down fall behind the swf. The swf is the be the difference image. Here is the link to my test site: http://www2test.ku.edu/~kueafin/index.html The drop down menus should be in front of the be the difference swf. In IE/win they are behind. Any ideas?? I tried the z-index, but to no avail. Is there an IE hack for this?? Thanks, Melissa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] swf priorities over css drop down menus
It still doesn't work in IE/Win.:( Following the direction on this site: http://www.anekostudios.com/2006/08/03/son-of-suckerfish-and-flash/ I did this: div id=bethediffscript type=text/javascript AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash. cab#version=7,0,19,0','width','472','height','291','title','be the difference','src','swf/be_the_difference','quality','high','pluginspage','ht tp://www.macromedia.com/go/getflashplayer','movie','swf/be_the_difference' ); //end AC code /scriptnoscriptobject classid=clsid:D27CDB6E-AE6D-11cf-96B8-44455354 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.ca b#version=7,0,19,0 width=472 height=291 title=be the difference param name=movie value=swf/be_the_difference.swf param name=quality value=high param name=wmode value=transparent embed src=swf/be_the_difference.swf wmode=transparent quality=high pluginspage=http://www.macromedia.com/go/getflashplayer; type=application/x-shockwave-flash width=472 height=291/embed /object /noscript /div Did I put these items in the correct place??? 'wmode=transparent param name=wmode value=transparent Thanks, Melissa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] swf priorities over css drop down menus
Try setting the wmode param to opaque or transparent ... // Sebastian -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Melissa Meyer Sent: 17. oktober 2006 22:30 To: css-d@lists.css-discuss.org Subject: [css-d] swf priorities over css drop down menus Good Afternoon, I am new to the list so I apologize in advance if I what I need help with is redundant. I searched the archive for my problem, but had no luck. The site that I am working on has css drop down menus in it and I just put in an swf file that is beneath the menus on the page. In FF/Mac it looks great. Internet Explorer loads everything just great, but when you roll over the menus the items in the drop down fall behind the swf. The swf is the be the difference image. Here is the link to my test site: http://www2test.ku.edu/~kueafin/index.html The drop down menus should be in front of the be the difference swf. In IE/win they are behind. Any ideas?? I tried the z-index, but to no avail. Is there an IE hack for this?? Thanks, Melissa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 IE7b2 testing hub -- 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] Shining examples of CSS-driven nonprofit corporate sites?
A cooperative, hope it helps: http://www.e2design.com.ar/Dev/CELP/ Regards; Eugenio. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-based calendars?
I've volunteered to put together a community calendar web page for my housing community. I could easily put something decent-looking together with tables, but I'd much rather use a more informational layout, where I could use CSS to display the calendar as a list or as a traditional table-esque monthly calendar. Is anyone aware of any examples on the web of something of this nature already being put into use? I can think of how I'd need to organize the data (I'd probably need named styles for each week of the month and each day of the week, so that regardless of month, the dates would display on the correct days, in the correct places on a generically defined calendar), but I know that creating a basically-tabular layout with CSS is often a big challenge. Erik Harrishttp://www.eHarrisHome.com -AIM: KngFuJoe - Yahoo IM: kungfujoe7 - ICQ: 2610172- Chinese-Indonesian Martial Arts Club http://www.kungfu-silat.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Remove frame borders through CSS
On 10/17/06, Felix Brill [EMAIL PROTECTED] wrote: Bernat Lleonart wrote: Hi, I'm building a site using frames, and if I use the property border=0 in the frame tag, because it doesn't validate. I'd like to know how can I achieve the same effect through CSS. Simply do: frame { border: none;} Felix I'm trying with frame { border: none;} and it doesn't work (perhaps because I'm on Firefox on Mac OS X?). __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] It works!!! swf priorities over css drop down menus
I got it to work in IE/Win and FF/Mac. The menus act funny in Safari/mac though. If anyone has any ideas as to why I would appreciate suggestions, but I am grateful for help I received so far! http://www2test.ku.edu/~kueafin/index.shtml Melissa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Serious problems in IE 6
Hi list, i made myself a new and shiny theme for my personal site, but am having problems with it in IE 6. It looks like, when hovering a hyperlink in the main content area or the right sidebar, the background in the (floated) sidebars, are ... well... not displayed right. Can any of you confirm this behaviour at http://istyledthis.nl/ or http://istyledthis.nl/themetastic/changelog, and have any idea on how it could be fixed? Yours sincerely, Stefan Nagtegaal __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] It works!!! swf priorities over css drop down menus
Melissa Meyer a écrit : It does not work in Safari. Safari thinks that the swf is allways on top, no matter which Z index you give to your menus. I'ts a Safari limitation or bug. I had the same problem and the only solution I found is to place my menus under the swf. If you find a solution, let me know. Luis I got it to work in IE/Win and FF/Mac. The menus act funny in Safari/mac though. If anyone has any ideas as to why I would appreciate suggestions, but I am grateful for help I received so far! http://www2test.ku.edu/~kueafin/index.shtml Melissa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 IE7b2 testing hub -- 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] Serious problems in IE 6
tefan Nagtegaal wrote: It looks like, when hovering a hyperlink in the main content area or the right sidebar, the background in the (floated) sidebars, are ... well... not displayed right. Looks like a HasLayout problem. adding: * html #wrapper { height:0; } fixed it for me. For more information on the subject see: www.satzansatz.de/cssd/onhavinglayout.html Rainer -- www.rohschnitt.de __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] validation
Thanks so much for all the responses to my TIDY validation question (and to those who politely reminded me that my question was HTML- rather than CSS-related). However, some of the responses have lead to something I've wondered about which *is* CSS-related. Does setting image dimensions in a style sheet and leaving them out of the HTML cause problems in any browsers? Thanks, Patti --- [TotalNet (www.totalnet.us) has scanned this E-mail for viruses using Declude Anti-Virus] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] faux column with a mix of fixed and undefined width columns
In classic GUIs it is quite easy to do what I aim for, but I don't recall ever figuring out how to do it in css. div id=container div id=text lots of text paragraphs /div div id=right fixed width column of icons and indicators /div /div I wish container to get 100% width, right to get say 10em width and text to get 100% - 10em width. Hmm, I think I once got tables to behave like that. Would some display:table do the trick? Henrik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] faux column with a mix of fixed and undefined width columns
div id=container div id=text lots of text paragraphs /div div id=right fixed width column of icons and indicators /div /div I wish container to get 100% width, right to get say 10em width and text to get 100% - 10em width. How about doing something like your container at 100% width with a right padding of 10em, then your text at 100% width, and your right div being 10em wide with the margin pushing it past the outer edge of the container? Something like that? ~Shelly __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] CSS-based calendars?
Is there a particular reason your looking to do it without tables? I've had a couple people ask me this question in private (I got basically the same type of question from a few people who feel that tables are totally appropriate for a calendar). My reason for wanting to do this in CSS instead of with a table is that I'm thinking of a list of upcoming events as a dataset, and the traditional month-calendar table as one possible method of presenting that data. For example, a community calendar could say: Thursday, August 6: Newsletter published Saturday, August 15: community yard sale Saturday, August 22: community picnic (and so on) It's not inherently a table, but if you choose to display it in the typical calendar format, it's displayed that way. I was thinking of possible implementing a style-switcher, allowing people to view either the table-style calendar or a list of dates (especially since the month-calendar will probably be sparsely populated, where as a five-line list might give all of the information for two months, maybe making it better for printing). This is WELL beyond anything I've done with CSS in the past, and it may not even be possible, but I thought I'd ask anyhow. If it can't be done, I'll just go ahead with the typical tabular calendar. Usually, when I come up with a design for a web page, I end out with a big idea and then have to scale it back due to CSS/HTML limitations, browser implementation issues, or limitations in my skill level. This will probably be no different. :-) Erik Harrishttp://www.eHarrisHome.com -AIM: KngFuJoe - Yahoo IM: kungfujoe7 - ICQ: 2610172- Chinese-Indonesian Martial Arts Club http://www.kungfu-silat.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] faux column with a mix of fixed and undefined width columns
Found the answer (guess I had forgotten some float basics) put right column before text, and define right with float right and text with no float or width but with a 10em margin. In classic GUIs it is quite easy to do what I aim for, but I don't recall ever figuring out how to do it in css. div id=container div id=text lots of text paragraphs /div div id=right fixed width column of icons and indicators /div /div I wish container to get 100% width, right to get say 10em width and text to get 100% - 10em width. Hmm, I think I once got tables to behave like that. Would some display:table do the trick? Henrik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 IE7b2 testing hub -- 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] vertical scroll bar shifted in IE
Is it the 3px monster that shifts the scrollbar under the outer edge? I have a fairly simple two floated column layout in a div wrapper. I tried removing the margins from the wrapper div, but that made no difference. Henrik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Large gap
~davidLaakso wrote: Daniel Hammond wrote: URL: www.objectivedesigns.com If you go to the photography page and scroll about 2/3 of the way down through the photo thumbnails, you'll see that in IE6, there's a big gap of emptiness. Any idea why this is happening? Unless I am really missing something, I do not see what you describe in xp ie6.0. Regards, ~dL Hi Daniel, I see the problem ( IE6 on Win98SE ) ! http://home.tiscali.nl/developerscorner/css-discuss/images/objective-gap.gif The problem will magically solve itself with a little help :-) : adding a doctype to the thumbnails-page. Then you are loosing the IE-only colored scrollbar, but winning a good display. See testpage http://home.tiscali.nl/developerscorner/css-discuss/test-objective.htm. Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] mock-up help
Brian Cummiskey wrote: http://hondaswap.com/files/template.jpg *What's throwing me off are the stars.* They have randomly placed stars/flowers around the questions as in the example I've linked above in random sizes (images, not shapes) What's the best way to get these in there? I'm trying to avoid absolute positioning as this will be a fluid-width design, and wrapping on the questions for smaller resolutions will throw it all off. I had no stars hanging around, and I couldn't find a good reason to avoid absolute positioning in fluid layouts. Anyway, here's what I came up with... http://www.gunlaug.no/contents/wd_chaos_25.html Maybe you can make something out of it. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-based calendars?
Erik Harris wrote: Is anyone aware of any examples on the web of something of this nature already being put into use? Have you looked into Google Calendar? You can create a layer just for your housing community, and show that calendar on your web page. Hopefully you'll be able to view this answer (if not, you may have to have a google acct first): http://www.google.com/support/calendar/bin/answer.py?answer=37103 http://www.google.com/support/calendar/bin/answer.py?answer=34578 Users can view it in Month mode (traditional calendar) or Agenda mode (list of events). HTH, lohroffe __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] mock-up help
Gunlaug Sørtun wrote: http://www.gunlaug.no/contents/wd_chaos_25.html Ahhh relative (percent) absolute positioning. Why didn't i think of that? That's a perfect example, Gunlaug. Thanks! I'll get crackin' on that and let you know what I come up with. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] CSS-based calendars?
Erik Harris wrote: Is there a particular reason your looking to do it without tables? I've had a couple people ask me this question in private (I got basically the same type of question from a few people who feel that tables are totally appropriate for a calendar). My reason for wanting to do this in CSS instead of with a table is that I'm thinking of a list of upcoming events as a dataset, and the traditional month-calendar table as one possible method of presenting that data. For example, a community calendar could say: Thursday, August 6: Newsletter published Saturday, August 15: community yard sale Saturday, August 22: community picnic (and so on) It's not inherently a table, but if you choose to display it in the typical calendar format, it's displayed that way. I was thinking of possible implementing a style-switcher, allowing people to view either the table-style calendar or a list of dates (especially since the month-calendar will probably be sparsely populated, where as a five-line list might give all of the information for two months, maybe making it better for printing). This is WELL beyond anything I've done with CSS in the past, and it may not even be possible, but I thought I'd ask anyhow. If it can't be done, I'll just go ahead with the typical tabular calendar. Usually, when I come up with a design for a web page, I end out with a big idea and then have to scale it back due to CSS/HTML limitations, browser implementation issues, or limitations in my skill level. This will probably be no different. :-) I see that the ability to do things as a list might be very interesting, letting you do things like nest a list of seven days inside a week, a list of weeks inside a month, and so on. Just a simple adaptation of some of the many scripts and CSS that make things like drop down navigation lists work! Then you could drill your way down to a particular event ... -- David [EMAIL PROTECTED] authenticity, honesty, community __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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/