Re: [css-d] IE spacing question
Julian Tulip's Licorice wrote: I am starting my first (almost) all CSS site, and I already have a question. Probably typical... If you look at the site: http://www.johnkehm.com/jk http://www.johnkehm.com/jk/style.css The 'print examples, web examples and contact' box renders differently between Firefox and IE6. IE moves it down and left quite a few pixels and also adds spacing between the links. It must be an easy fix? I would like to learn the hacks etc as I go. Any help is appreciated, John You are mixing apples and oranges (among other things). An element can't be both float and absolute positioned. Putting the margin for the nav on the li instead of the ul fixes (sort of) IE6 and IE7. The border attribute is not valid with an xhtml 1.0 strict doctype. These and other corrections are on the file http://www.chelseacreekstudio.com/ca/cssd/jk.html. Not to rain on your parade but you'll be more successful with CSS if allow the software to do the work and embrace Web standards and accessibility. Emulating a table-based layout and/or print media concept in CSS is counter to what some of us cherish. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check please
trevor bayliss wrote: */David Laakso [EMAIL PROTECTED]/* wrote: Thanks as ever for the reply David. I have implemented those changes http://216.219.94.105/david1.htm and will change the p´s and h´s to make it look smarter. The AccessibilityCheck box that reads: ignore font sizes I have done-what a nightmare I feel like I´m back to square one again now! I have no idea where to start to sort out the problem the cl div (which is the offending one) is floated right. The only tools I have knowledge of are clear for this case. I will try clearing right and clearing left and clearing both and see what happens. The word Environment (under the 4th image) may be too wide, thus pushing out and dropping the float because there is not enough room for it. Clearing is not going to help. Reduce the font size slightly for all those h's under the images. And in the mark up the word Environment with soft hyphens, like so: Environment. This will cause the word to hyphenate when scaled in IE. See if the float still drops at text-size largest. ~d - What an awesome bit of code the soft hyphens David! Shame it only works with IE as it could sort out some of my breaking issues in FF!! ;) Stupid question while trying to follow your advice how can I change the h´s under the images if the h´s size isn´t controlled by my style sheet anymore with The AccessibilityCheck box that reads: ignore font sizes . I can change them fine for ff obviously but for IE how can I do that? Or do I need to use a default tag that will give me a default size? The file [1] is now holding in IE6without dropping the float at text-size largest with font-sizes ignored. The answer to your question is endless tweaking of col widths, font-sizes, margins, padding, and adding clear: right; to to the further most right column. Extensive change has been made to the CSS as well as some changes to the markup. Make sure you backup your current file! Cursory tested in IE6, IE7, Opera, Firefox, and Camino. You or someone on the list who has more patience, time, and skill will need to correct the remaining issues. [1] http://www.chelseacreekstudio.com/ca/cssd/trevor-03.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] unwanted whitespace around li tags
Erin Spangler wrote: http://www.clients.thedogsonline.com/DriscolsBlueGenes/index2.html I've zeroed the margins and padding on every element that I can think of, yet I'm still getting some whitespace between my list items. I left the green background color of the ul so you can see the space I'm referring to. I've validated my HTML, so I don't think that's it either. Any assistance would be appreciated. You'll find my CSS embedded in the document for now. Thanks! If you add this to your style sheet, dose it close? img {display: block;} Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I've got the IE blues...
John Lockerbie wrote: Dear Listers, I think my test site - http://catnaps.org/latest/saturday.html with http://catnaps.org/latest/latest.css - works on most popular sites, including WinIE7. However WinIE5.1, WinIE5.5 and WinIE6 appear to have what I assume is the double margin bug but which I can't resolve. WinIE5.5 also has a problem with the top menu bar. On the Mac browsers all is mostly as it should be, though I don't know how it behaves on Opera. Please could somebody suggest how to to resolve the 5.1/5.5/6 problem - and could they have a look at it on Opera? Interesting. It looks fine in ie/mc5.2 (bless it's loving little heart). I am not running a pc right now so can't check 6 7. IYou'll want to install Opera: she is not containing the top and bottom divisions Menu for al-Salata al-jadida pages. On a local file, deleting the /height/ and adding float:left; to selector #menucontainer1, #menucontainer2, seemed to help (but not sure how it will play out cross-browser). Also Opera (at least on a mac) is not honoring the font-specification for the top and bottom h-nav's and did not look into the reason but deleting the letter-spacing may at least put it on one-line. Trivial pursuits: Not nice (in my opinion) to feed all that tiny content type to win/ie in pixels forcing most of the world's users to jump through hoops to ignore your font sizes in order to read it. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I've got the IE blues...
John Lockerbie wrote: David, Thank you for the comments. I should have said it seems to be fine on Mac/Opera, as it does on Safari and Firefox, it's the Windows environments I've no access to. I'd not spotted the font size problem as I'm new to coding. This is my third attempt to redesign my site - see the problem in http://catnaps.org/islamic/islaurb.html - in order to reduce page lengths. JL The comments I made regarding Opera are when I veiwed it on a mac: Version 9.21 Build 3678 Platform MacOS X System 10.4.9 If page height is an issue could you split the pages or use js to open and close division sections. With regard to fonts, I am referring more to IE's inability to scale fonts when set in pixels, /regardless of page height,/ unless the user goes through the drill of putting the browser in accessiblity mode with the ignore font-sizes specified box checked. One way to avoid this is to set percent at user default (100%) on the body, and then use percent on individual selectors throughout the style sheet as needed (line-height is best specified as a raw number). For example: body {font: 100%/1.4 arial, helvetica, sans-serif;} h1 {font-size: 180%;} #footer p {font-size: 80%; line-height: 1.2;} Best, ~d -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS image/div handling questions...
Andrew Wallace wrote: Ok, so I think I'm starting to get a handle on this CSS stuff. Maybe. I have the following page: http://test.diamondwphotography.com/travel/DisplayTrip.php?n=200706_SWV And I have a few specific issues I'm wrasslin' with. I have images wrapped in divs, so that I can keep image and caption together, and have a border around the set. andy The easiest way to resolve any html/css problem is to make sure the document is valid [1]. There are something like 49 markup errors on your page. A well constructed page can sometimes fail to render properly with one markup error. Granted your page may not, or probably will not, work as intended even if valid, this may be the best place to start... [1] http://validator.w3.org/ Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I've got the IE blues...
John Lockerbie wrote: On 30/07/07, David Laakso [EMAIL PROTECTED] wrote: John Lockerbie wrote: I forgot to say, I've still got the problem with what I think is the IE double margin problem which I can't seem to solve. It shows itself in Win IE 5.1,5.5 and 6, but not 7. See Browsershots: http://browsershots.org/website/http://catnaps.org/latest/saturday.html Does anybody know what I've done wrong? Regards JL The address for the problem float drop which occurs on Win IE 5.1,5.5 and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css file: http://catnaps.org/latest/latest.css With kind regards JL John, If you can cope with not having cross-browser pixel perfection, the correction on a local file (without hacking) is to change the margin in #sidebar to read: margin: 10px 0 10px 5px; Others on the list may offer a better alternative. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I've got the IE blues...
John Lockerbie wrote: On 30/07/07, David Laakso [EMAIL PROTECTED] wrote: John Lockerbie wrote: On 30/07/07, David Laakso [EMAIL PROTECTED] wrote: John Lockerbie wrote: I forgot to say, I've still got the problem with what I think is the IE double margin problem which I can't seem to solve. It shows itself in Win IE 5.1,5.5 and 6, but not 7. See Browsershots: http://browsershots.org/website/http://catnaps.org/latest/saturday.html Does anybody know what I've done wrong? Regards JL The address for the problem float drop which occurs on Win IE 5.1,5.5 and 6 but not 7, is: http://catnaps.org/latest/saturday.html with css file: http://catnaps.org/latest/latest.css With kind regards JL John, If you can cope with not having cross-browser pixel perfection, the correction on a local file (without hacking) is to change the margin in #sidebar to read: margin: 10px 0 10px 5px; Others on the list may offer a better alternative. Best, ~dL -- http://chelseacreekstudio.com/ David, I'll have a look at that suggestion though I would prefer to get a more symmetrically arrangement if at all possible. With kind regards JL John, I experimented a little and have it closer in compliant browsers as well as IE7 through IE5.01 (did not check mac/ie5.2). It may not pass a micrometer test for cross browser pixel perfection but it is far better than it was. Note that the file is now in quirks for IE6 and down, and that in 5,5 and 5.01 the page is now centered. You'll want to validate. And I don't remember all that I changed. You'll need compare my styles with yours. The uri is: http://www.chelseacreekstudio.com/ca/cssd/arch.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I've got the IE blues...
David, Thank you very much for your time and effort. I'll take a close look at what you've done and see if I can then amend my site to suit. Incidentally, the site was always supposed to be centred. I've been trying to re-rationalise what I'm doing and simplify it but seem to be getting lost with all the different methods I'm trying. Isn't css fun...? With kind regards JL John, You are welcome and I hope it works out. And, yes CSS is fun (particularly when you can find answers in the list archives that have not been messed up by folks who top post). Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font problem?
Luc wrote: Good afternoon list, I just encountered a strange phenomena (at least to me): resizing the text in Fireworks and Moz, breaks up my navigation (around increasing to 200% and up), while in Opera it holds up to 1000% and in IE up to extra big. I tried setting the general font rule to 100% but that didn't solve it, tried setting the width of the #navcontainer to 9.5 ems but to no avail... What am i overlooking here? http://www.dzinelabs.com/projects/MPT/Pages/index.php http://www.dzinelabs.com/projects/MPT/Styles/MP.css I have no idea what you are overlooking. Except maybe Opera handles stuff different. And something movable (type) on top of something static (an image) is problematic (except maybe in Opera, sometimes). Did not try it, but... try re-setting to 100% on the body, reducing the font-size on the nav (and repeating the image on the nav y-axis)? body { font : 100% Verdana, Geneva, Arial, Helvetica, sans-serif; --- :: re-set from 76% to 100% ... } #navcontainer li { font-size: 80%; ---:: declare background: url(../Images/navbackground.gif) repeat-y 0 0.1em; ---:: declare repeat-y instead of no-repeat ... } Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] No brainer with margin/padding
Luc wrote: Good evening list, This has got to be a no-brainer but i can't get my hands on it: i've got a customed error page where the margin/padding is driving me nuts. the h1 holds the warning: Error 403: Forbidden Access forbidden to remote server The goal is to have Error 403: sitting flush to the left of the container and to have Forbidden Access forbidden to remote server flush to the right of the container. Error 403: has a class with a float: left. This of course does the trick but i was trying to get the same effect without float, just by using marging/padding but that doesn't fall to well... trying several values i couldn't get it aligned like i want. http://www.dzinelabs.com/projects/MPT/Pages/error http://www.dzinelabs.com/Stylesheets/error You could use absolute positioning, but that always seems to cause more problems than it is worth (for me) . This [1] is one way to do it with floats and has been cursory tested in ie6 and 7 and in compliant browsers. http://www.chelseacreekstudio.com/ca/cssd/forbidden.html HTH. ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Zen Garden as a model and my printing issues
I’m just really curious if I need to relearn how to code pages with CSS in order to solve this printing issue. Luke Ling Oh, is that all... 1/ Google using the subject line: css- print style sheets 2/ 40 layouts with the primary content first in the source http://blog.html.it/layoutgala/ Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check
[EMAIL PROTECTED] wrote: Just a basic site check: http://resume.christianziebarth.com/ I'm trying to be very modern here while keeping it simple. I'm using the Yahoo reset.css and a screen style sheet, a print style sheet, and a handheld style sheet. The testing I've been able to do indicates that everything's working fine. Thanks in advance. Christian Ziebarth Very simple and nice, Christian. A little difficult to distinguish clickable links. And as a personal and subjective, thought just a a little touch or hint of color might be a nice touch? BTW, the css validation service has an issue resolving your host name. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Opera not delivering the goods
Ian Young wrote: Development of liquid site is coming on. Ok in Safari, FF, IE6 and IE7. However, in Opera the divs don't align on right hand side. How frustrating. http://www.iyesolutions.co.uk/templates/trossachs/index-3.html compare with fixed col version at http://www.iyesolutions.co.uk/templates/trossachs/ Any thoughts guys? I am going to take the plunge and guess that the difficulty may be that you've used fractional percent column widths and Opera is rounding them causing the page to be a different width than Firefox. The rounding percent issue is a known Opera problem. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Help! I Have NO Idea What I'm Doing
Elli Vizcaino wrote: Ok I figured out how to get my flowers to line up where I wanted them to. It turns out I had to adjust the pixel value in my width properties by a couple pixels. I still need to figure out why the bottom-margin I gave the blue row doesn't show up in Safari. So if any one cares to chime in - I'd greatly appreciate it. TIA Elli So I created: www.E7Flux.com/index3.html in an Here is the CSS: http://e7flux.com/css/e7flux.css Hoping someone can help me solve this. TIA, Elli Perhaps you have fixed this, or I do not understand the problem... As far as I can tell the page is rendering consistently in 10.4.10 in safari, webkit, camino, and opera. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] best way to display a non-inline image
Michael Leibson wrote: Here's a very basic question (I hope!): What is the most efficient way to display a non-inline image (eg, a logo) that will stand on its own (ie, with no superimposed text, etc)? As a 'background-image' within a div? With an inline style, with 'display' set to 'block'? (Eg, img src=image.jpg style=display:block; width: 100px; margin: 0;) If as an inline style, is there a way to define this back in the style sheet - perhaps with an ID? Some other way? I can't find anything that addresses this in Meyer's 'CSS-Definitive Guide'. Thanks! - Michael If the logo is purely decorative (no image text) then my guess is one would use a background image. If the logo has image text then I guess you might call it from the source document (html); and, call the style for it from an external css file (rather than using inline styles). For example: #header img {...} And, then also provide some means for users, with or without assistive devises (screen readers), to read the image text. This is one such technique: http://www.tjkdesign.com/articles/tip.asp I hope this answers your question. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] font-size :: opera
Both win/opera (9.1) and mac/opera (9.22) are rendering h1 smaller than intended in this rough layout: http://www.chelseacreekstudio.com/ca/cssd/experimental.html Why be that? Thanks, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size :: opera
Felix Miata wrote: On 2007/08/06 10:03 (GMT-0400) David Laakso apparently typed: Both win/opera (9.1) and mac/opera (9.22) are rendering h1 smaller than intended in this rough layout: http://www.chelseacreekstudio.com/ca/cssd/experimental.html Why be that? H1-H6 in Opera have their own unique preference sizes in px unrelated to whatever size you may have set on web page normal text. You didn't set a font-size on any ancestor of H1, so NAICT, it uses the standard 32px Opera H1 default to have your 685% applied to. O.K. The fix (unless someone has a better way) for this particular layout seems to be: h1 { /*font-size : 685%; */ --- :: delete font-size : 262%; --- :: add } #header { background-color : #c0c0c0; width : 100%; font-size : 262%; --- :: add float : left; } And revise the markup so that the ul is beneath, rather than enclosed, in the header division. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Frustrating Problems in IE6
Matthew Stoneback wrote: I have two issues with my design and IE6. If anyone can help I would be greatly appreciated. First, the navigation located on the left and right side is set up to have a hover effect. Adding 100% width to the anchor should fix both (I only did the right nav) Validation: I know I have a few problems. The doctype has been corrected and a different xml declaration and method for character encoding used. The language part of the js call was deleted and CDATA sections (or whatever one calls those things) is used to hidw the js from the validator. Here is the link to my HTML: http://www.eddysound.com/filing/ Here is the link to my second HTML page: http://www.eddysound.com/filing/html/felony.htm Here is the link to my CSS: http://www.eddysound.com/filing/style/epso.css Matthew Stoneback I forgot to put in all your images. The file is valid now. I am not sure I answerted all your questions-- but it is a start. See: http://www.chelseacreekstudio.com/ca/cssd/justice.html Hang in there. You are doing fine. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size :: opera
Bruno Fassino wrote: David Laakso wrote: Both win/opera (9.1) and mac/opera (9.22) are rendering h1 smaller than intended in this rough layout: http://www.chelseacreekstudio.com/ca/cssd/experimental.html Why be that? The problem seems caused by the inability of Opera 9 to manage font-size expressed in percentage greater than about 500%. You have found a good fix that avoids such percentages, another one would be to use em, so instead of font-size: 685% write font-size: 68.5em. At least this is what I see in a simplified test case: Compare this page in Opera and Firefox: http://www.brunildo.org/test/bigpercfont2.pl?pc0=100pc1=1000step=50 A sequence of 'I' of increasing sizes, first from 100% to 1000%, and then from 1em to 10em, are displayed. This first sequence in Opera 9 stops increasing at about 500%. You still have a font-size: 550% on the h3, which are indeed slightly smaller in Opera then in Firefox. Best regards, Bruno -- Bruno Fassino http://www.brunildo.org/test Ah, so that's what this is all about! Thank you for the test page. The method you suggest of using em when over 500% for Opera9 is much simpler solution for this page and works fine (I believe we meant converting 685% to 6.85em, rather than 68.5em). I deleted the percent setting on #header and and h1 and re-set and tweaked h1 to: font : bold 6.9em/0.8 arial, helvetica, sans-serif; This seems to be working well in both win mac opera (and the evil one). h3 is more consistent in opera as compared to ff in setting it from 555% to 5.6em. The revised page uri is: http://www.chelseacreekstudio.com/ca/cssd/experimental01.html Thanks. ~d __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] image replacement techniques and CSS
Michael Leibson wrote: Hi, I've a question about image replacement techniques and CSS. For details, please see: http://members.distributel.net/~leibson/Gilder-Levin.htm Thanks. - Michael I am not sure how to answer your question /or/ if I can answer it at all. In a situation where you want to use a /particular heading font/ that is not available on any or all cross user operating systems, you can set that font (providing you have on your system) as an image using Photoshop. Image replacement is more a means of putting heading content in your file as text. And then overlaying that text /with an image of the text in the particular font/ that is not available on any or all cross user operating systems. You get the advantage of providing the particular font /you/ want in your headings without compromising (maybe) the benefits of accessibility. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why does font-size not work?
On Sat, 11 Aug 2007, Robert Tilley wrote: style p { color: white; font-size: large; } /style /head body div style=color: white; font-size: large; pSample text of a large size./p /div It works. Perhaps you do not see it because there is no point of reference? Try: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd; html xmlns=http://www.w3.org/1999/xhtml; head meta http-equiv=content-type content=text/html; charset=utf-8 / titlelarge/title style type=text/css body {color: #000; background-color: #fff; } p.c1 {font-size: large; } /style /head body div pSample text at user default./p p class=c1Sample text of a large size./p /div /body /html Best, ~dL http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 shell game
tedd wrote: Hi gang: Please review: http://www.webbytedd.com/clients/torch/philosophy.php While using IE 6 (for both Win-XT and Win-2K) the text in the main section of this page (below the menu and above the footer) is displayed sometimes and other times it's hidden. Any ideas as to why this is happening? Thanks, tedd Try?: #content { width: 900px; ---:: add width to this selector to give it layout [1] :: } [1] http://www.satzansatz.de/cssd/onhavinglayout.html Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Hover [reformulated]
faramineux wrote: Here is the basic code I use for links: a:link { color: #5a0113; font-size: 13px; font-weight: normal; text-decoration: none; } a:hover { color: #2B4058; font-size: 13px; font-weight: normal; background-color: #fffbdf; border-bottom-style: dashed; border-bottom-width: 1px; } The 3 linked images - including the logo - on the page show the styling too on hover! For example when I hover over the logo, the dash line/color appear under the logo. Something is wrong It is a guessing game until you supply a clickable link to the page in question with your post to the list. In the meantime, try adding this ruleset to your style sheet: img a:hover { text-decorarion: none; border-bottom: none; } Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Nested list problem
Michelle Tarby wrote: Let me preface this by saying I got roped into fixing someone else's code - can someone tell me why the first item in the white is shifting over to the left in IE: http://wwwdev.lemoyne.edu/education/graduate.html I'm almost tempted to throw the whole thing out and start with clean css, but its got me stumped. Thanks in advance for any suggestions. Defeatist that I am, I tend to agree with your opinion to start from scratch (but someone else on the list may offer a simple fix). I did not look at it in IE as I do not believe it is working as intended in compliant browsers, either. Mixed bag of conflicting rules confusing the software, I guess... Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check and advice please!
Mark Finney wrote: Hi All, I have just redone a site for a friend using css instead of Java script as someone had done previously... could people have a look in different in different browsers? Also comments on the CSS would be appreciated since I am just learning it. I think I may need to use some kind of preloading technique as the roll over images were slow to load the first time I used it... My version can be found at: http://helpusmarry.co.uk/jessie/ The original is at: http://www.jessieford.co.uk/ Thank you in advance! Mark Mark, I am stumped. It is attractive. No question about that. But how to use it is a mystery. I just don't get it. I am a little thick I think. If I disable images I get a black screen. Best shot (for me) is to instead simply disable CSS. Doing that I can see the illustrations all on one page. If I were then to add a /text rather than an image/ title; some content /text rather than an image/ stating who, what where, and when; and a simple / text rather than an image/ navigation scheme, I might then be able to move from one complete page of illustrations to another complete page of /different/ illustrations. I guess what I am trying to say is that you may not have a css issue -- but rather a problem of the need to provide more clues to what the site is about and provision for a simple means to use it. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Review Request (Win IE 5.5, 6 and Mac)
Francesco (Sin City Creative) wrote: Hi guys! A new css-based site I did most of the work on is online. Looks flawless and as intended on Windows IE 7 and Windows Firefox 2. I ned some help with: Windows - Opera, IE 5.5 and IE 6 Mac - Common browsers http://newsite.omedix.com/ http://newsite.omedix.com/Styles/OmedixStyles.css Thanks in advance! Francesco Mac/ff You may, or may not, want to: -- Ditch the rivers: /*p { text-align: justify; }*/ --Keep the footer text from breaking out the bottom with font-scaling --Move the inline css styles to the external style sheet --Hide the js from the markup validator and/or call it from external files --validate the markup and css Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Beginner: img distances
Ingo wrote: Dear list, obviously a simple matter, but I'm stuck. On http://web-bereiter.de/chobocca.com/chobocca.html I'd like to put the menu-bar images one by one without any space. I tried to give them a class with 0px margin/padding and other measures - but there are still some pixels inbetween them. What is wrong here? Appreciate any hints. Regards, Ingo Simple that works is difficult. Complex that fails is easy. /One way/ to close the gap is to run the markup of the four items as one continuous string-- rather than stacking them as you have. Don't forget to run your page through the w3c markup [1] and css [2] validation services. [1] http://validator.w3.org/ [2] http://jigsaw.w3.org/css-validator/ Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] positioning
Gillespie, Michael A wrote: Am trying to resolve a deficiency in my understanding of positioning in general trimmed Mike G Hmm. Might be best to just like sort of slow down a bit and kind of take it one step at a time. Float based layouts, particularly those that employ negative margins, work well on the Web and are structurally sound. Such is not the case with layouts based on position absolute: they are just too brittle. Concentration on what works, namely floats for layout, will get you further faster. This is a great tutorial [1]. Read it carefully. Employ the method and produce a two column layout. Things will go your way. You can count on it. [1] http://www.alistapart.com/articles/negativemargins/ Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Disappearing Primary Nav
John Gribben wrote: Hi everyone, A client is unable to view the primary navigation on this site: http://www.albaadvisors.com/ They claim to be having this problem with the latest version of Firefox on XP. I've tested with this browser and don't have the problem. Can anybody spot something I am doing wrong? Thanks, John Oh it's there alright on mac/ff but may not be exactly easy to see at 116.5dpi for anyone over the age of eighteen. FWIW, deleting the height (s) on this selector will prevent the content text from shooting out the bottom with font-scaling: div#centercontent.home {...} Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] alignment position - liquid layout issues
Ray Leventhal wrote: Ray Leventhal wrote: Hi all, I'm implementing a layout based (Strongly) on the holy grail liquid layout[1]. snip grr...i hate it when I forget the reference :) [1] http://www.alistapart.com/articles/holygrail This aricle [1] may help with regard to some of your issues? [1] http://www.satzansatz.de/cssd/hgjump.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help! dropdowns were working but have stopped in ie7
Melinda Odom wrote: Hi, My drop downs have stopped working in this store: http://www.prayerbookstore.com They were working in ie7 and the top was centered but my browser is showing it off to the left and the menu dropdowns are not working. Works fine in mozilla and netscape. Can someone please confirm this? I may be having a cache problem or something. Sincerely, Melinda Odom Melinda, In both IE6 and IE7: -- the menu is shifted left --the text in the footer is shifted left -- the About Us link is on two lines (stacked) In IE6 the drop-downs appear on hover; In IE7 the drop-downs /do not/ appear on hover. Although it probably will have no effect on the current issues, you may want to validate the html. I regret I do not know the fix for these issues, Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help! dropdowns were working but have stopped in ie7
Melinda Odom wrote: Hi, I found the problem...this page was edited and a different doctype was put in and as soon as I changed it to: !DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd; everything started working again in ie7 and probably ie6 but don't have that one to test. Sincerely, Melinda Odom Melinda, Yes, I'd say you found the culprit-- rendering fairly consistently now in ie6 and ie7 on xp (and in safari and camino). ~d __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] color consistency, accuracy
Listsmem wrote: Has anyone else noticed this problem before? [trimmed] ~Ben Yes. But since it is not necessarily a specific css related problem, you may (?) find http://webdesign-l.com/ a better place to seek an answer. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] space under logo and left column height
Cynthia Page wrote: It looks almost like it should on a mac with ff, the only problem being a space under the logo in the top banner. In IE on a PC one see the same space and the left column is a few pixels above the two columns to the right. The left column is absolutely positioned so I could just move it down a few pixels to have it line up with the other two columns, however then it is too low on the mac :) http://hoengerlab.colorado.edu/b3d/indexe.html Cynthia For the image problem: have tried deleting the padding on #topbanner? Don't have win/ie right now. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Firefox Right column anomoly
Brian Walk wrote: Strange thing happening in Firefox. Load the following page: http://www.physics.niu.edu/physics/outreach/index.shtml Notice the Events box floating above the large image. Now hit Refresh, and it repositions down into it's proper place (visit the same link in IE 6.0, and it appears correctly the first time). Any thoughts that would be causing this to happen in Firefox? I am thinking it has something to do with the position:relative attribute on the id#divContent #divRightCol id, but if it corrects with refresh, what is Firefox (mis)interpreting on its first attempt to load? Many thanks in advance. Brian There are 121 markup validation errors. Maybe that is the problem? http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.physics.niu.edu%2Fphysics%2Foutreach%2Findex.shtml Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 2-column layout
Shelly wrote: What I need is a 2-column layout, with a 300px sidebar *on the left*. The site should be centered and 90% in width, with the right size fluid and taking up the remaining space. ~Shelly This is one way to do it: CSS html,body{background-color:#fff; color:#000;margin:0;padding:0;} body{font: 100% georgia,serif;text-align:center;} p{margin:0;} #container{border:1px solid fuchsia;margin: 0 auto;text-align: left;width: 90%;} #header {border-bottom: 1px solid fuchsia;} #wrapper{float:right;width:100%;margin-left:-300px;} #content{margin-left:300px;} #c1{float:left;width:300px;} #footer{border-top: 1px solid fuchsia;clear:both;width:100%;} HTML body div id=container div id=headerh1header/h1/div div id=wrapper div id=content pright column/p /div /div div id=c1 pleft column/p /div div id=footerpfooter/p/div /div /body /html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check, please
Lorraine Barte Nepomuceno wrote: Hi everyone, I'm having problems with a design of mine. On some browsers (although not any of ours here at the office, but that may be because we're all widescreen), the right sidebars are pushed down below the main content area: Sample is at: http://www.splashscreen.com/wp/ with CSS at: http://www.splashscreen.com/wp/wp-content/themes/geeks-blog/style.css Any help would be most appreciated! Thanks, Lorraine The floats drop as the window narrows. Have you tried setting the page as a fixed width layout? div#container{ margin:0 auto 0 auto; /*max-width: 920px; width:90% !important;*/ width:920px; } Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] different browsers
Terri Houston wrote: Is there a website where I can see my menu page with all the different browsers? If not, can someone check www.ttcollectiblegifts.com/dynamicdrive.html using IE6, and send me a screenshot? I was told the menu was large, and I hope I've fixed it, but can't see it with IE6. All help is appreciated. Terri It looks the same in ie6 as it does in ff, opera, and safari. As already mentioned there are markup errors-- validate [1]. If you are on a pc, multiple ie versions are easy to install [2]. If you are on a mac, you can run any windows version of ie with Parallels Desktop [3]. Best, ~dL [1] http://validator.w3.org/ [2] http://tredosoft.com/Multiple_IE [3] http://www.parallels.com/ -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] RahulGonsalves.Com // Site Check
Rahul Gonsalves wrote: http://rahulgonsalves.com/ver3-b/ A site check, and a fix for this problem would be appreciated: The gray background image seems to be shifted 1-pixel lower in Windows browsers (FF/Opera/IE6). They display fine on FF/Camino/ Safari on OS X. Any suggestions? Furthermore, the thumbnails of the projects on the 'Projects' page seem to have no vertical padding in IE6 (XP). What can I change? Feedback is appreciated, on any aspect of the website-to-be. Warmly, - Rahul. Sorry. Dunno. Don't care. The intentional clipping of your name comes off as an error (personal opinion). Didn't get past that. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: aligning divs horizontally
Raumin Ray Dehghan wrote: Dear CSS list: I'm trying to align three div boxes in my site horizontally - Layer3, Layer4, and Layer 5. One - called Layer3 appears more out of line than the other two, but i want to make sure they're all aligned horizontally. I would appreciate any suggestions. the html url is: http://www.westchicago.lib.il.us/R/stuff/chatt/wcpld.html the css is: http://www.westchicago.lib.il.us/R/stuff/chatt/wcpld.css just fyi - the javascript is: http://www.westchicago.lib.il.us/R/stuff/chatt/wcpld.js Thanks very much. Sincerely, Raumin Ray Dehghan Adult Services Librarian West Chicago Public Library It is very difficult for me to understand what you are attempting to do. The best I can make out is that you need a three column layout. The easiest way to achieve that is simply to use an existing layout that is known to work cross-browser. This is one that will meet that need. Plese see: http://blog.html.it/layoutgala/LayoutGala07.html. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help - IE6 missing Pictures
Peter wrote: Hi, I am at a loss here. IE6 is not showing a row of pictures, on any page ( these are click through links to sponsor websites). IE7/FF/safari/opera (all on windows) show them correctly. Can any body check they are there (may be a setting on my other pc running IE6) website: http://www.hrfc.com/ css (relevant to problem) http://www.hrfc.com/Styles/mainlayout.css Peter Looks the same in IE7.0 as in IE6.0 and FF (all difficult to read at 116.5dpi). Breaks too early in FF with font-scaling; and in IE7 and IE6 the fonts go crazy and the right column drops at text-size largest. Adding: html {font-size: 100%;} will resolve the IE em based font-size bug that makes the fonts go goofy in IE. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] It won't work in IE6
Richard Brown wrote: Hi On 04/09/07, Richard Brown [EMAIL PROTECTED] wrote: Why won't this site work in IE6 please? http://www.apbassettsolicitors.co.uk/ http://www.apbassettsolicitors.co.uk/wp-content/themes/bassetts/style.css It works in all the other IEs. I've borrowed(!) code from Georg and redone the site. I have taken a look and it appears to be working in IE6. In IE5 the header files are missing but if that is really the only problem then I'm not worried. Could someone check for me please? Thanks. The code from Georg: http://www.gunlaug.no/tos/moa_12tp1.html And thanks to Georg. I guess what you mean by working is that in IE6.0 that the links in the left column are now clickable whereas before they were not? So in that sense, yes.. it is working. And holding at text-size largest. There is a repeat border sort of thing on the right side of the page when those links are clicked-- passable I suppose, but a little annoying. When you borrowed the code from Georg, you neglected to include his javascript fix for IE6; consequently, IE 6 and down will not honor min/max width. I did not view the page in 5.5 or 5.01. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] It won't work in IE6
David Laakso wrote: Richard Brown wrote: Hi On 04/09/07, Richard Brown [EMAIL PROTECTED] wrote: Why won't this site work in IE6 please? http://www.apbassettsolicitors.co.uk/ http://www.apbassettsolicitors.co.uk/wp-content/themes/bassetts/style.css It works in all the other IEs. I've borrowed(!) code from Georg and redone the site. I have taken a look and it appears to be working in IE6. In IE5 the header files are missing but if that is really the only problem then I'm not worried. Could someone check for me please? Thanks. The code from Georg: http://www.gunlaug.no/tos/moa_12tp1.html And thanks to Georg. I guess what you mean by working is that in IE6.0 that the links in the left column are now clickable whereas before they were not? So in that sense, yes.. it is working. And holding at text-size largest. There is a repeat border sort of thing on the right side of the page when those links are clicked-- passable I suppose, but a little annoying. When you borrowed the code from Georg, you neglected to include his javascript fix for IE6; consequently, IE 6 and down will not honor min/max width. I did not view the page in 5.5 or 5.01. Best, ~dL I see now you did include the javascript for IE6 and down. However, the reason it may not be working is you targeted the wrong selector. The target is #wrap not #wrapper. ~d -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3px IE6 gap
Anne E. Shroeder wrote: Got an IE 6 problem -- it's putting a 3px gap between my two divs - left one is floated, right one is set at a left margin to equal the photo plus border. http://www.language-works.com/CSS_Stuff/specialreport.htm Have tried a variety of things to close the gap but nothing works. Any ideas on the hack I need here? Anne Use a different construction and you will need no hack(s). Quick tested IE 7,6,5.5, 5.01; and Mac/IE5.2, Opera, and Firefox. http://www.chelseacreekstudio.com/ca/cssd/news.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3px IE6 gap
Rafael wrote: Hi, I have a limited knowledge on the different bugs out there, so I would like to know what problems would cause a more conservative structure for this problem, such as http://dev.rsalazar.name/css.d/report.html I just did it as an exercise (so I started from scratch), but it seems to work just fine on Fx 2, O 9, S 3 (XP), and IE 6 / 7. Thanks in advance. Yes, of course, there is more than one way to do most anything in CSS. FWIW, I would not restrict the height as it will break with heavy hand font-scaling in compliant browsers and in IE at text-size 'largest with font sizes ignored. Whether one needs to have it also work in IE5.01 and Mac/IE5.2 is a matter of opinion and client requirement. Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] floats and div widths
Cynthia Page wrote: I am experimenting with layout for divs containing images and text. The outer div will go inside a three column layout. My question concerns floating and clearing images in divs, nested within a floating div. Should I float an image left and clear right to make the text stay to the right of the image, and if I declare a pixel width for the image with padding will I have problems with IE displaying the whole image? I have an example posted. Also is it appropriate to ask such a basic question on this list? Thanks, Cynthia http://hoengerlab.colorado.edu/testfloat/float.html All questions dealing with CSS are appropriate. And your question is anything but basic. The simple answer is what you have works cross browser (don't forget to validate). The practical problems arise in putting that inside a 3 col layout and keeping the float from dropping at narrow window widths (800 or less) and user discretion with font-scaling and side bar use at all window sizes -- /particularly in iE/. It is some what dependent on your base 3col layout-- a fixed width 750px layout may easier to cope with. This [1]is a crude sample of your stuff insie a 3c layout. See source for changes made. Others on the list may have more pertinent advice. [1] http://www.chelseacreekstudio.com/ca/cssd/5col.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] layout column height adjustment...
Michael Forker wrote: Hi havn't been on here in a whilehelloI am an Interactive Multimedia design student...havn't that much experience with CSS and I am having a go at doing my first site for a clientthe problem is that with the layout in the pages when I put content into the various pages differing on each pagethe layout columns at the bottom of the pages are not equal as in on each page the length of the columns are diiferent on the different pages the left column...middle column...right column.on different pages are different lengths.tried adjusting the top:200px; rule which did work at the bottom of the column but shifted the position at the top.the link to my site ishttp://ijsr32.infj.ulst.ac.uk/~10300205/index.htmlportfolio pagecurrent work link ( FIREFOX ) If anyone can help would appreciate it a lot!! Mike It is an interesting problem. A simple solution is found here http://www.alistapart.com/articles/fauxcolumns/. More complex solutions for creating this illusion may be found here http://www.satzansatz.de/cssd/companions.html. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] MAC Browser Issue
Steve LaBadie wrote: I have a new site and have an image that moves only on a MAC using Firefox, Netscape, and Safari. The image actually goes behind the page and a little piece sticks at the top behind Support ESU link. Is there anything I can do to make it stationary? The image that moves is the WarriorAthletics bar that goes down the right side of the page. http://www4.esu.edu/athletics/index.cfm Steve LaBadie, Web Manager Steve, You'll have a difficult time at best trying to get cross-browser consistency when running a page without a doctype. http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww4.esu.edu%2Fathletics%2Findex.cfm Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check
Michael Forker wrote: Think the site I am working on is more or less navigation and design wise is more or less completed, I would like to add a submit form page on the site...but haven't done this before ( not hinting at anything ) if anyone could check the site and give me some honest feedback I would appreciate it a lot.it's the first site I have done for a client Mike:) http://ijsr32.infj.ulst.ac.uk/~10300205/ Michael, It is dropping the right column float at +1 font-scaling in FF. This may be due to the software being confused by the fact that you've made no distinction between the horizontal and vertical navigation CSS. For the sidebar navigation css, try adding #sidebar to each declaration (#sidebar #navigation {...}. The horizontal navigation font-size makes that navigation more important than your written content-- might be a good idea to reduce it to 0.9em or 0.95em. Justified text does well (sometimes) in print media, but seldom on the Web: creates word gaps (rivers). Consider setting it flush left/scatter right (text-align: left;). I'd defer to the type designer and /not/ letter-space the content text as it just makes it difficult to read. You may also want to change the font-size on the body from 12px to 100%. This will set the typography base at user default. You may want to validate the markup. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Vertical alignment of title and nav menu
Jan Erik Moström wrote: I would like to create a page that have the title and nav menu aligned at the top, something like this X N X X Do you mean like this? http://www.chelseacreekstudio.com/ca/cssd/test.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] basic explanations of css layout
Raumin Ray Dehghan wrote: Colleagues, does anybody have any recommendations of books and/or websites that explain css layout in very simple, straightforward language? For example, i'm trying to understand why pixels seem to be easier to work with than percentages, etc. Thanks very much. -Raumin Ray Dehghan West Chicago Public Library West Chicago, Illinois Ray, This is the only book on CSS that I have ever looked at and it is very simple, quite straight forward, and very practical: http://www.cookwood.com/html5ed/. I think their is a list of books and other resources on the list wiki. I suppose if you have fixed width elements, such as images in your layout, that fixed width layouts may be easier to work with tha percentage width layouts. As the window narrows fixed width elements become difficult to keep from escaping their containers with percent widths. But as I remember your layout (although I can't find your uri at the moment) and the difficulties you were having had more to do with the fact that you structured your layout using absolute positioning. Float structured layouts work much better. Your difficulty perhaps has less to do with CSS than a misconception in understanding the Web. It is a fluid medium. Absolute positioning is brittle and best avoid for the basic layout structure. If you like, write me off-list and I''ll attempt to help you get your layout functioning cross-browser. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Vertical alignment of title and nav menu
Jan Erik Moström wrote: David Laakso [EMAIL PROTECTED] 07-09-11 12:19 Jan Erik Moström wrote: I would like to create a page that have the title and nav menu aligned at the top, something like this X N X X Do you mean like this? http://www.chelseacreekstudio.com/ca/cssd/test.html Bad explanation on my part, this is what I meant: TitleTitleTitleTitleTitleTitle one two three four TitleTitleTitleTitleTitleTitle TitleTitleTitleTitleTitleTitle Hello there Footer (the title is one only one line but has a larger font size than the nav menu) jem More like this, then? http://www.chelseacreekstudio.com/ca/cssd/test.html Best, ~d -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Type in px then ems
Rick Lecoat wrote: We know that text specified in px is a Bad Idea. What I want to know is: does the inability to resize px-sizedtext fonts in IE Win get inherited if the child text is specced in something else (ems, say)? Eg: body {font-size: 14px} h1 {1.8 em} Would the h1 still be non-resizable in IE Win? Cheers; If you know it is a bad idea, why would you do it? Your example will likely goofy in IE because of an IE browser bug when specifying fonts in em. If you specify the font size in em you need to /declare percent on html or body/ (with so called em guided layouts no percent on html and no em on body is used, but further in the specification in percent is needed on a containing wrapper followed by em on selectors) to kill the bug. This is a relatively common method of specifying text-size in em: html {font-size: 100%;} body {font-size: 1em;} h1 {font-size: 1.8em;} Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check Please
Omitade Adediran wrote: I have been reading and reading until my brain just feels like mush...[trimmed] http://www.orisadevotees.org/market.html Omitade Omitade, I know the feeling. This stuff can be terribly frustrating at times... I think that it might be a good idea to just get a simple page working cross-browser for starters. Once you've got that working, you can plug decorative images into it. Most any dropdown/flyout menu is really hard to get working properly in iE 6. This is a /very simple version/ of your page-- quick tested in ie6, ie7, opera, firefox, and safari. http://www.chelseacreekstudio.com/ca/cssd/un.html HTH. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check pt2
Omitade Adediran wrote: Hi: Just when you thought you were finished with me (scary music, She's Back!!), I am submitting the second page for a check. This is the home page that goes with the other page I submitted. It has a slide show and some repetitive music and yes, I will work on an off button. It looks great (to me) in FF. There is a problem with the lining up of the titles under the thumbnails at the bottom in Opera and the font size goes larger than what I want in normal view. This is my attempt at columns and what happens in IE which, of course, does not run the slides is that the columns collapse on each other. www.orisadevotees.org As always, your help is greatly appreciated. Omitade Omitade, This new page has the same issues as the page you put up yesterday [1]. Try either page at screen resolution 800. Or at 1024, 1280, 1680 or higher with plus1 or plus 2 font-scaling. One solution, as yesterday, is to start with a very simple structural layout that functions at most any window width on any broswer. [1] http://www.orisadevotees.org/market.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] why do scrollbars suddenly appear...
sandy wrote: http://www.sandygonzales.com/pca/support_pca/ everytime i click on one of the tabs in my site (eg: Support PCA)? THe pages are broken right now but that doesnt matter. This does not happen in ie, but it does in firefox and NN. my tab image links are set to width: auto with a few backgrounds - one that is repeating, so they can scale to any size text-length. Have you tried deleting all instances of overflow: auto; and width: auto; on the #nav_portal selectors? Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ie6 issue with auto width
sandy wrote: http://www.sandygonzales.com/pca/support_pca/ same site different ie problem. figure i'll keep going on my roll of ie issues. my horizontal navigation that look like gray tabs are expandable buttons, in preparation for a CMS where the client may add their own categories. all the elements from the li inward are display: block; and float: left (for ie6 otherwise i'd only have declared it once).. so when i rollover these tabs, because they are bold on hover, the tabs expand a bit like they are supposed to.. BUT! not in ie6, they do in ie7 though. in ie6 the bigger bolder text simply stretches right out of itself. why oh why! I did not try this to see if it holds in IE, but you might try simply increasing the horizontal padding? #nav_portal ul li a span b{ display: block;/* put this in for ie6 - floating */ float: left; font-weight: normal; padding: 10px 30px 0 30px; !-- was padding: 10px 13px 0 13px; } The content text is really tiny. You may want to bump it up some. If you don't, the inclination for some users will be to scale the fonts-- that ain't gonna be a pretty site if they do Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ie6 issue with auto width
sandy wrote: David Laakso wrote: sandy wrote: http://www.sandygonzales.com/pca/support_pca/ same site different ie problem. figure i'll keep going on my roll of ie issues. my horizontal navigation that look like gray tabs are expandable buttons, in preparation for a CMS where the client may add their own categories. all the elements from the li inward are display: block; and float: left (for ie6 otherwise i'd only have declared it once).. so when i rollover these tabs, because they are bold on hover, the tabs expand a bit like they are supposed to.. BUT! not in ie6, they do in ie7 though. in ie6 the bigger bolder text simply stretches right out of itself. why oh why! I did not try this to see if it holds in IE, but you might try simply increasing the horizontal padding? #nav_portal ul li a span b{ display: block;/* put this in for ie6 - floating */ float: left; font-weight: normal; padding: 10px 30px 0 30px; !-- was padding: 10px 13px 0 13px; } The content text is really tiny. You may want to bump it up some. If you don't, the inclination for some users will be to scale the fonts-- that ain't gonna be a pretty site if they do Best, ~dL i hardly call that a solution! thats just a quick fix that ruins the aesthetics of the page! oh and thanks about the text, forgot about that. thanks, sandy Thank you for reminding me to mend my ways. Best wishes, ~d -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check please
Cory Shubert wrote: Hi all, I am throwing our new design out there for critique and suggestions. http://www.nwaworldvacations.com BLOCKED::http://www.nwaworldvacations.com We tried to do a better job of CSS and moved into a more Web 2.0 vibe, ...{trimmed} I am posting here to help us continue on that learning curve. Cory Cory, If you mean what you wrote about transitioning to CSS then you may want to /continue to employ tables for the tabular data/. But as of now, it seems to me, you're running a predominately table oriented site with a doctype. The way some of us handle Ajax/JavaScript functionality is to use same with the qualifier the page will work, as well (if not better), without either or both. Your slow page loads may be more part and parcel of the Web 2,.0 vibe than a practical CSS issue. Fast load from the CSS perspective, in my opinion, has more to do with lean, mean coding practice. Eliminating inline styles and other table like practices, calling js from an external file, and reducing white space in the source document /may/ help speed things up to a lessor extent. Testing at +1 and +2 font-scaling in compliant browsers is a good idea; and, providing text for IE users without the need for them to jump through hoops to scale it is always advantageous. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with site template
[EMAIL PROTECTED] wrote: Hello, I have a few problems is completing site template: http://www.linkhomes2000.co.uk/mortgage-repayment.php 1) I can't make min-width work in I.E. 6, probably not in any others either ({can't check others} Works reasonably well in FF). 2) Need to make my menu more accessibility friendly, but not sure how to go about this. (not sure if this should be on this forum) Kind Regards DG) With regard to the menu: that is complicated and difficult menu to pull-off cross-browser. You may be better off with unobtrusive javascript. Or a site map. If your definition of accessibility includes readability of the content text for those fortunate enough to be sighted, or partially sighted, these additions and deletions may be the first step toward that: body { font-size:100%; font-family:Arial, Helvetica, sans-serif; color:#00; background-color: #fff. /* letter-spacing:0.0125em; word-spacing:0.0225em; line-height:1.25em; font-weight:bold; text-decoration:none;*/ } #content p, #leftbar p { /*font-size:100%; font-family:Arial, Helvetica, sans-serif; color:#324040; text-decoration:none; line-height:1em; font-variant:small-caps;*/ margin:0; padding:0; } Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] :: Opera/9.23 Mac ::
Georg, I have a little rendering mystery. Opera/9.23 Mac is not behave quite the same as Opera/9.23 Win on this page: uri http://www.chelseacreekstudio.com/ca/cssd/sm-chg/ (I would suggest disabling images unless you plan to take in a movie while you wait for them to load) css http://www.chelseacreekstudio.com/ca/cssd/sm-chg/css/style.css For example, the ul numeral b01/b should be red. And it is red in both OS at 100%. But Opera/Mac /does not retain the red color/ at 90% and below, or at 110% and up. On this test page with the ul isolated there is no problem whatsoever in Opera/Mac-- the color of the numeral 01 is red regardless of the percent of font-zoom. http://www.chelseacreekstudio.com/ca/cssd/test-opera.html Where have I gone wrong? Thank you. ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: Opera/9.23 Mac ::
David Laakso wrote: I have a little rendering mystery. Opera/9.23 Mac is not behave quite the same as Opera/9.23 Win on this page: uri http://www.chelseacreekstudio.com/ca/cssd/sm-chg/ (I would suggest disabling images unless you plan to take in a movie while you wait for them to load) css http://www.chelseacreekstudio.com/ca/cssd/sm-chg/css/style.css For example, the ul numeral b01/b should be red. And it is red in both OS at 100%. But Opera/Mac /does not retain the red color/ at 90% and below, or at 110% and up. On this test page with the ul isolated there is no problem whatsoever in Opera/Mac-- the color of the numeral 01 is red regardless of the percent of font-zoom. http://www.chelseacreekstudio.com/ca/cssd/test-opera.html Where have I gone wrong? Thank you. ~dL Thank you for the replies both on and off-list. The good news is I seem to be the only one in the world for whom the issue(s) persists. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Font Size issue
Jehangir Larry wrote: I have a test page at: http://www.jehangirlarry.com/test.php I am unable to reduce the font size in any version of IE. FF/Opera are OK. Many thanks. -- Jehangir Larry I see relatively little difference in a side by side comparison with the above browsers and any version of IE at text-size medium. ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Font Size issue
Jehangir Larry wrote: David Laakso wrote: Jehangir Larry wrote: I have a test page at: http://www.jehangirlarry.com/test.php I am unable to reduce the font size in any version of IE. FF/Opera are OK. Many thanks. -- Jehangir Larry I see relatively little difference in a side by side comparison with the above browsers and any version of IE at text-size medium. ~dL My fault, not explaining the issue at length. I have now posted another full page at http://www.jehangirlarry.com/makhija/test.php When seen in FF/Opera/Safari (PC) the #header-sub (~Engineers Contractors~) appears as intended. In IE (all) - PC, it appears huge. Atleast here. Thanks for all replies on/off line. JL You explained it just fine the first time. The problem may be a setting on your end as it functions normaly here in IE6 and IE7. Best, ~dL PS You may want to validate the markup and css. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Content within wrappers not centralizing in IE7
[EMAIL PROTECTED] wrote: Hi all, I have the following webpage (http://www.trystandsamthewedding.com/home.htm), which is broken down into three sections: header, content and footer. Each section has a wrapper and then content, like so...[trimmed] Tryst I regret it is not working fine in Firefox either-- easily broken with font scaling. The problem, among other things, is it is unnecessarily complex: you have no doctype, the markup is invalid, the logo is not enclosed in the intended container, and more... You may be better off starting from scratch. If you do not get a better offer, write off-list and I'll try to help get it going. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] **SL-JUNK** Re: Content within wrappers not centralizing in IE7
[EMAIL PROTECTED] wrote: Hi, and thanks for the reply David. Thanks for pointing out the basic error from me to miss the DOCTYPE. Putting that in seems to have fixed the problem. RE: http://www.trystandsamthewedding.com/home.htm Hmm. ...depends on what you consider the problem(s), I guess. FWIW: not sure if this what you are after-- http://www.chelseacreekstudio.com/ca/cssd/untitled.html Quick tested: +3 font-scaling @ 800 1680 in safari, firefox , opera text-size largest font-scaling @ 800 1280 in ie7.0 and ie6.0. markup css validated Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Content within wrappers not centralizing in IE7
David Laakso wrote: [EMAIL PROTECTED] wrote: Hi, and thanks for the reply David. Thanks for pointing out the basic error from me to miss the DOCTYPE. Putting that in seems to have fixed the problem. :: mon 3:06p junk subject line deleted :: ~dL RE: http://www.trystandsamthewedding.com/home.htm Hmm. ...depends on what you consider the problem(s), I guess. FWIW: not sure if this what you are after-- http://www.chelseacreekstudio.com/ca/cssd/untitled.html Quick tested: +3 font-scaling @ 800 1680 in safari, firefox , opera text-size largest font-scaling @ 800 1280 in ie7.0 and ie6.0. markup css validated Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] justfied text and aligment
Erland Flaten wrote: I tri to make to lines of text to align justify inside a div. Text- align justify does not change from the default left alignment of the text. http://www.nuna.no/malkladd.html http://www.nuna.no/thrColFixHdr.css Erland, With single words you'll need to use letter-spacing rather than justify, but /you'll have devil of a time/ getting both lines to come to the same width cross-browser. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] justfied text and aligment :: revised ::
David Laakso wrote: Erland Flaten wrote: I tri to make to lines of text to align justify inside a div. Text- align justify does not change from the default left alignment of the text. http://www.nuna.no/malkladd.html http://www.nuna.no/thrColFixHdr.css Erland, With single words you'll need to use letter-spacing rather than justify, but /you'll have devil of a time/ getting both lines to come to the same width cross-browser. Best, ~dL Erland,, This is a very quick pass at setting 100% on html, 1em on body, with h1 h2 in em and tweaking the font size(s). This may be easier than using letter-spacing, but as with letter-spacing there will be cross-browser differences. http://www.chelseacreekstudio.com/ca/cssd/justify.html/ In Firefox/Mac h2 (tagline) is shy of width compared to h1. In Opera/Mac, Safari, WebKit, IE7 and IE6 are relatively similar-- h2 (tag line) is wider than h1. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site distortion in IE6
Thijs Hakkenberg wrote: Dear list, This site http://gerbrigseidel.nl/ and it's template http://gerbrigseidel.nl/fileadmin/template/simpleDesign/ both validate as w3c compliant, and the template show up fine on both IE6 and FF1.5/2.0. The rendered frontpage however get's distorted in IE6; it's not aligned anymore for example. Any clues? Thijs Hakkenberg This is your file[1] with the xml declaration deleted so IE6 is no longer in quirks and with only your style.css embedded. Looks pretty much the same to me in, but I may be missing something, in: Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1.7) Gecko/20070914 Firefox/2.0.0.7 and IE6 and IE7. [1] http://www.chelseacreekstudio.com/ca/cssd/cet1.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check on Suckerfish
Richard Brown wrote: Hi All Could you please check the following menu in IE6 and 7? I am told the menu is not behaving correctly. http://theriverchurch.info/ http://theriverchurch.info/wp-content/themes/RiverChurch/style.css Many thanks for your help. The Lord works in mysterious ways: perhaps you are being reprimanded for knowingly using a menu that drives everyone nuts who attempts to use it; not optimizing the images; and, making the start point of the primary content so tiny. The drop-down /drops down/ in 6 and 7. In 7 they stick, that is to say, when hovering across all of them they are simultaneously stuck in the drop-down position. In 6 the drop down boxes do not stick but they are wider than in compliant browsers (and even ie7), and each has a double vertical rule on both sides. There is a gap under the header image. And the header image, and the black block beneath that image, and the black footer block are all about 70px shy of the outermost container's right border. I regret I do not know the fix. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] menu test
JGardner wrote: Hi, For whoever has a second (risky question :-)) could you test the drop down function on the menu (there is only a drop down section under services). You can find the menu here - http://www.jgardnerdesigns.com/web-design-services.htm It seems like sometimes in IE 6 when you hover over the drop down links they disappear. Please let me know if this happens to you and if so what browser you are using. I am also still having the positioning problem in IE6 - the menu you will not move over to the left as it does with FireFox, and IE7. So if you see this problem on a different browser please let me know. Thanks for your time. Jennifer os x 10.4.01 I think the menu is as intended in safari, ff, and camino: but +1 breaks it in all. In opera, the menu is aligned left with the about block breaking left approximately 30px out of the outermost page container. xp ie6 and ie7 on parallels/os x 10.4.01 In ie7 the link blocks break the top of the nav background band approx. 8px. At text-sixe largest they break out the bottom of the background band. In ie6 the menu is the same as opera/mac (it is aligned and breaking left). And, as well, the link blocks break the top of the nav background band approx. 8px. Sorry for all the bad news... Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] margin/padding and li problem
Luc wrote: Hello list, i have a list with a background image that i just can't seem to get a bit less indented. It's a list of clients and upon adding the phone numbers, the ninth client on the list has it's number pushed to the next line. Opera is the only browser that doesn't do it. Obviously there isn't enough room to hold the number so i thought on giving the whole list a lesser indentation but i just don't seem to get it. http://www.mendesperestransportes.com.br/Pages/clientes.php http://www.mendesperestransportes.com.br/Styles/MP.css Probably a non-brainer, except for me!! Luc I may not get what you want. But, rather than adjusting the list, have you tried adjusting its container? #contentright {background-color: fuchsia; width: /*540px*/585px; float: right; /*padding: 0px 0 20px 0;*/ /*margin-right: 16px;*/ } Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Alternative Menu suggestions to the Suckerfish
Richard Brown wrote: Hi David On 21/09/2007, David Laakso [EMAIL PROTECTED] wrote: Could you please check the following menu in IE6 and 7? I am told the menu is not behaving correctly. http://theriverchurch.info/ http://theriverchurch.info/wp-content/themes/RiverChurch/style.css Many thanks for the reply. I have changed the subject to reflect the next question. What do folks do if they don't use the suckerfish option please? Any suggestions? I don't know. But if I had a dollar for fixing every problem with the suckerfishover the past few years on the css-d, wsg, and design-l lists I'd be a lot further ahead financially than I am at the moment. I'd search for a menu that is known to work cross-browser /and test it rigorously/ to make sure it lives up to expectation; and, then adhere very closely to it. As far a css solution a quick google search turned up (and there are more in the menu section of his site): http://www.cssplay.co.uk/menus/drop_definition.html There are also scripting solutions for IE6. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Website check please!!
[EMAIL PROTECTED] wrote: Test-site is: url: http://www.sun-safe.com.au/ css: http://www.sun-safe.com.au/default-stylesheet.css css: http://www.sun-safe.com.au/IE-stylesheet22.css Check your host/server-- connection reset (unable to connect)-- 9:14a. ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Include Remote JavaScript File
[EMAIL PROTECTED] wrote: Hello, I have a problem here: http://www.linkhomes2000.co.uk/index.php At present there is a lot of JS in the header, this is surrounded by: //![CDATA[ //]]. It validates and works fine. My problem is when I try to includes it like so: script src=filename.js type=text/javascript charset=utf-8/scriptIt wont validate and I'm getting all sots of wonderful errors, which make no sense at all.Any Ideas?Kind RegardsDG) Try: script type=text/javascript src=filename.js/script (and validate your CSS file) Best, ~dL PS Personal opinion: maybe just sort like delete the w3c button as it is a major focal point on the page, it just sets you up, confuses most users, and no offense intended-- looks amateurish. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] :: ie/6.0 in a 600 window ::
I am not able to load IE/6.0 at the moment and would appreciate a check of this page [1] in an apprx. 600px window at text-size largest to see if any floats drop. [1] http://chelseacreekstudio.com/ca/cssd/un/ Thank you. Best, ~dL PS I am aware that the header image has no background color in IE6. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: ie/6.0 in a 600 window ::
Rahul Gonsalves wrote: On 25-Sep-07, at 3:48 AM, David Laakso wrote: I am not able to load IE/6.0 at the moment and would appreciate a check of this page [1] in an apprx. 600px window at text-size largest to see if any floats drop. [1] http://chelseacreekstudio.com/ca/cssd/un/ Mr. Laakso, IE6, XPSP2, text-sizes smallest to largest, no float drops from ~400px to ~1000px. What pretty colours. Best, - Rahul. Thanks, Rahul ( I assume we mean around 600). BTW, ain't no /mister/ hereabouts-- just another bozo at the back of the buss headed for nowhere... Best, uncle ~david -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Cross-browser Display Issue / Problem With NOSCRIPT Validation
J Hodge wrote: Good evening to everyone. Testbed: http://www.lostinxlation.net/sandbox3/portfolio/cybernomics1.html Testbed CSS: http://www.lostinxlation.net/sandbox3/css/primary.css I'm trying to get this site ready for the final cosmetic touches I regret that any font-scaling whatsoever breaks your site with or without javascript enabled in any browser on any operating system. It may be best to tackle that before moving on to other issues. Regards, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Cross-browser Display Issue / Problem With NOSCRIPT Validation
J Hodge wrote: Thank you, David. I am aware that scaling is problematic, and was thinking the best approach would be to write the CSS so that the content areas become scrollable once the text size is increased. RE: http://www.lostinxlation.net/sandbox3/portfolio/cybernomics1.html We are into areas of personal opinion. My opinion is the content area height should not be constrained, and that on scaling it should drive what is beneatn it from here to Havana. However, upon further consideration, it occurs to me that that it might also be beneficial to scale up the dimensions of the overall layout as well... That is one way of going about it. My /opinion/ is you may want the site to work in any screen window. One way to accomplish this is to set min/max width and provide your favorite workaround for IE6. the particular layout I'm using was one I picked for some practice in source ordering and the use of relative positioning, and it has certainly posed its own little challenges. =0) Nevertheless it is a valid concept. One can, and should (yet another opinion), set to maintain the css disabled/text browser source order: doing so can sometimes pose tricky and difficult css manipulation. And this is where others on the list are better qualified than I am to help bring this particular valid concept to a successful conclusion. (treswife at gmail dot com) Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] fixed div in IE6
Bob Rosenberg wrote: Greetings: I hope this is not too trivial for comment, but searching for it in the archive has proved fruitless--it's just too hard to narrow down the search. On a page like http://users.rcn.com/rtberg/Adam/animag1.htm I have a left-column menu (div id=nav) that stays nicely fixed in FF or IE7 (for example), but which will not behave in IE6. It's a big file, but it's not complex HTML or CSS, and in IE6 I simply cannot make #nav hold still (or, for that matter, even show up in the left column). I do not want a second scroll bar on the page. I have tried fixes found on CSS advice websites (like http://divinentd.com/experiments/emulating-position-fixed.html), but at best they give me ugly double scroll bars. The CSS is at the top of the document. Thanks for any help offered. --Bob R. Simulating position fixed in IE6 ain't anything but trivial. There are a number of workarounds for emulating position fixed in IE6, including javascript, these are some: http://www.howtocreate.co.uk/fixedPosition.html http://tagsoup.com/cookbook/css/fixed/left/ http://annevankesteren.nl/test/examples/ie/position-fixed.html http://www.doxdesk.com/software/js/fixed.html a very nice working solution -- perhaps Georg Sortun will provide a link to the base layout: http://www.gunlaug.no/contents/toc_7a.html Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] fixed div in IE6
Julia Perez wrote: The problem I think is: body { behavior: url(csshover.htc); } I can see the dropdown menu in IE7 and Firefox Mozilla but not in IE6. I´ve already put: csshover.htc The same example worked in another site and now I use it here and it doesn´t work. Whay??? The link is: http://www.padawan.bblogg.com.ar/emsetec/empresa.html Dunno. Is csshover.htc being found: check the path? Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a css animation?
Phil Turner wrote: Hi Everyone, this is more of a thought that a question about 'how to fix my website across browserland' I am pretty new to the land of css however I have done a site here http://www.trishahills.com/home.htmlmy question for discussion is can the 3 second intro page be repeated again and again to create a slow stop frame animation - has this been done before creatively and has anyone got any links also can the pages be sent into the screen from different directions? Apologies if this is basic css, I look forward to the response Regards Phil Turner Phil, I think this has nothing to do with CSS. But, I guess for starters my question is what 3 second intro page as the site is dead in the water. You can use scripting or a timed meta attribute to create an endless loop; but either way, I think the question is off-topic for this list. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] footer float dl misbehaving
David Bailey wrote: Hi, I am having trouble with a footer that's not behaving the same in Safari and FireFox (Mac). I haven't been able to check it out in IE Win as my pc is not working at present. http://www.dab-hand.co.nz/NZCFBS/3col.html http://www.dab-hand.co.nz/NZCFBS/styles/main.css David Hmm. Forgive me, but it may be time to look at the big picture. The /page/ is not working in any os or browser the way I /think/ you intend. And there is more to it than which browser gets the footer right according to the w3c specs. In addition to the footer problem in compliant browsers, both ie 67 drop the main right column float, and have a footer problem as well. IE is known to have issues with some percent width layouts. The complicated methods used to position the content and the footer information (using percent) within a percent structure further confuses things for all browsers. I may be one who gives up too early: but I have most of my hair (except what hasn't fallen out from age ). A nice stable, robust, layout that works cross-browser (if you treat her with the grace and dignity she deserves): http://www.alistapart.com/articles/negativemargins Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Page check
Scott Povlot wrote: I have just finished a new page design. This is my first using a fixed width page. It looks OK on Windows IE6/7 and Firefox. Can you please validate on other OS and browsers? Also, any comments on the design would be appreciated. The URL is http://www.piedmont-div.org/nmra/nmra_home_page.html Thanks very much, Scott Povlot Scott, Just a quick look in camino and safari and mac opera. I'd suggest setting the width of #shop from the em width you have to around 200px (to keep it from expanding horiz and dropping th float w/ font-scaling). The set of links at the bottom right corner of the page break as well. Eighty percent of default (on body) is kind of tiny start point for those using a high dpi monitor. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Page check
Scott Povlot wrote: Thanks, David. I changed the #shop width to 200px. That's much better. However, I am not sure what you mean about Eighty percent of default (on body) is kind of tiny start point for those using a high dpi monitor. What resolution are you using? What do you suggest for a font setting? Scott re: http://www.piedmont-div.org/nmra/nmra_home_page.html Scott, Generally speaking, your fonts scale well. That is to say there is little problem for those who may, for whatever reason, wish to view and read the text of your site at a larger size than you have specified. And that is good! If user default can said to be 100%, you've reduced what they prefer by specifying 80% on the body (or 20% smaller than they /may/ prefer). This is /sometimes/ problematic for users who are using monitors at a higher default dpi or screen resolution than your monitor [1] [1] body { font-size:80%; } A nice touch, /and this is a personal opinion/, would be to give all users default [2] [2] body { font-size:100%; } Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Rounded and extended
Ian Rutgers wrote: Pls take a look at http://www.breakthe800.ca/test/index_rounded.php (ignore colors). I am almost where I want to be but have reached a roadblock. I have now got the rounded corners but am having trouble getting the columns extend all the way to the footer (left, center columns) without content the way the far right column extends width content. Ian You might consider using faux columns [1] or the companion column [2] method. Some of the liberties you took in the document make it 4.01 html rather than the doctype you specified [3]. I regret the header is not quite as intended in IE6, and the green block and those below it drop. [1] http://www.alistapart.com/articles/fauxcolumns/ (ala timed out on me at sat 6:35p) [2] http://www.satzansatz.de/cssd/companions.html [3] http://validator.w3.org/ Best, ~dL ** http://www.alistapart.com/articles/fauxcolumns/ -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] bottom alignment of two columns
William M Conlon wrote: I'm working on a new layout at http://new.ggfilms.com/ using http://new.ggfilms.com/css/styles.css I have two sets of columns. The upper set aligns vertically at the top with each other as desired. The lower set of columns is supposed to align at the bottom, with each other, and this is proving difficult for me. I've adding padding-top to the right column in order to push it down to about the same bottom as the left column. The text in the two lower columns is not likely to change much, so I can live with the padding approach, but I'm curious if there is a better alternative. thanks. Bill I am not sure if I understand what you're after. Or if this resolves the issue. As it stands div#bottom is not enclosing the floats contained within it. One way to open it is to float it left or right: div#bottom { background-color: fuchsia; float: left; } --:: add to enclose the floats div#bot_address p{ margin: 0; --:: add to bring p to the top of its enclosing container padding-top: 20px; --:: add to push p to the bottom of its enclosing container float:left; font-size:.6em; line-height:1em; /*vertical-align:bottom;*/ --:: not needed? } div#bot_nav {background-color: lime; --test color float:right; text-align:right; font-size:.8em; padding-top:5em; } You may need to clear those floats as the right float may drop with font sizing. When specifying em for font size, add html {font-size: 100%;} to defeat an em -sizing bug in iE. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Previous Layout Issues
J Hodge wrote: David, I always appreciate your input when I approach the CSS list for ideas / hints / helps, even when we don't necessarily agree on approach. That said, I've spent the last few days re-coding the site on which I am working, with a specific aim towards making it function better upon text-enlargement...trimmed] http://www.lostinxlation.net/sandbox3/index.html http://www.lostinxlation.net/sandbox3/css/primary.css ~~J. (treswife at gmail dot com) J Hodge wrote me off-list regarding Re: [css-d] Cross-browser Display Issue / Problem With NOSCRIPT Validation J, You are still having some text enlargement issues. Probably it is the absolute positioning and setting height to the wrong elements that's throwing you off. Perhaps this will help to at least get you started [1] (very quick tested at +2 in compliant browsers and at text-size largest in IE6 and 7). [1] http://www.chelseacreekstudio.com/ca/cssd/hodge01.html hth, ~dL PS I don't think you can divide a pixel. And while hacks are sometimes necessary, becoming dependent on them is seldom a good practice. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] re. refining tex-align: justify
Michael Leibson wrote: Jukka K. Korpela wrote: . . . it is easy to insert a no-break space,. . . as the entity reference nbsp;, e.g. likenbsp;this? Similar things can be done in CSS . . . you can write span class=nobrlike this?/span with .nobr { white-space: nowrap; } Jukka K. Korpela (Yucca) http://www.cs.tut.fi/~jkorpela/ Thanks to both you, Jukka, and Philippe, for addressing this problem. Jukka, I don't know what I'm doing wrong, but neither nbsp; nor creating a span class with {white-space: nowrap;} has so far worked for me. If you could possibly take a quick look at my css and mark-up, at: http://members.distributel.net/~leibson/justified%20text,%20with%20various%20problems.htm -- I'd be most grateful! Oh yes: does nbsp; work in HTML 4.01 Transitional? Thanks! - Michael I'd be tempted to cut-in the widows in with a #10 x-acto knife and rubber cement; and, dry up the rivers with a sponge. Regards, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Previous Layout Issues / WAS: Cross-browser Display Issue / Problem With NOSCRIPT Validation
J Hodge wrote: David, I looked at the example you sent, and I see where you are going with it. The problem in this case is that a height, or at least min-height, *has* to be specified on #container for the CurvyCorners script to work properly... trimmed ~~J. Hodge (treswife at gmail dot com) In reference to uri :: http://www.chelseacreekstudio.com/ca/cssd/hodge01.html Add both js to the file, and: #container { border : 1px solid silver; margin : 20px auto 0 auto; --- :: the 20px margin at the top as shown :: text-align : left; width : 757px; height : 34em; -- :: add :: min-height : 34em; --- :: add :: } The rounded corners come up in ff/mac and opera/mac on a local file and hold with font-scalling. You'll need to test in on your server with a PC withe font-scaling in IE6 and IE and resolve any other issues that may remain. Best PS Still no need to hack Opera on this end. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Previous Layout Issues / WAS: Cross-browser Display Issue / Problem With NOSCRIPT Validation
J Hodge wrote: David, Thank you for this. I did apply it, and it does work in conjunction with the script - my first iteration used percentile dimensions instead of ems. Also, on the surface, it does appear to solve the font scaling issue. Except... trimmed I am not able to resolve your issue (s). You will want to seek assistance from someone else. Good luck and best wishes for success. Regards, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] refining text-align: justify
Michael Leibson wrote: Ernie Finlay [EMAIL PROTECTED] wrote: You could simply add to or reduce (minor)the font size to suit.:) Thanks, Ernie. In the end, I decided to increase my paragraph's width enough to pop the offending widow back onto the end of the previous line. - Michael And what happens to your widow and your rivers if the user reduces the window width, uses a sidebar, has a minimum font size set that is greater than yours, bumps the font-sizes, or ignores your frozen fonts in IE and sets text-size largest? Regards, ~dfL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Border dash bug in IE?
Ryan J Nauman wrote: At http://sai.cup.edu/caltimez/ - I'm running IE6 at work. The left and right dashed borders on my middle div (content) are messed up and appear solid at certain points down the page. Any ideas how to fix? Thanks It is a (another) bug in IE6. Try feeding IE a solid border. * html #foo {border-right: 1px solid #eee; border-left: 1px solid #eee;} Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] some text is rendering different between browsers..
Julian Tulip's Licorice wrote: Hello, I have what I am sure is a common question here, I am learning the ropes and I am stuck, my source renders fine in Firefox but it does different stuff in IE6. http://www.johnkehm.com/kona I put borders around the areas in question. I want it to look like it does in Firefox. Any help will be a big relief. Thank you, John John, Georg Sortun has already spelled out the problems. This is /one/ way to resolve some of them [1]. Note that you'll want to use real text. But if you are compelled to doing a client driven photoshop thingy bites tongue, you'll need to provide an image replacement technique-- search engines and text-browsers are unable to read text set as an image. A fair test for structural purposes is the layout should hold at least a +2 font-scaling in compliant browsers, and text-size largest in the 'evil one.' [1] http://www.chelseacreekstudio.com/ca/cssd/fish/fish.html Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] :: camino-- image border issue ::
The Creative Director is not happy. The left border is missing around his picture (bottom of center panel). http://www.chelseacreekstudio.com/index.html Thanks, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] some text is rendering different between browsers..
Julian Tulip's Licorice wrote: Hello, Thanks very much for the response. I have to use graphics unfortunately. in fact, all the real text may get swapped with graphics which I think is absurd. a lot of the graphics on the site are also text,i just pull them off the screen with a negative margin, this way if i turn styles off the page is still useful. It looks like a lot of my problems were solved by fixing the Doctype, RE: http://www.johnkehm.com/kona Yes, of course... how flaky of anyone to think otherwise Regards, ~dK __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] :: camino-- image border issue :: resolved
Tee G. Peng wrote: I had similar problem with Camino once . Wrap the img in a p or div does the trick. pimg class=c5 src=ca/site/images/thumbs/self.jpg alt= width=175 height=245 //p Hope this helps! tee On Oct 4, 2007, at 3:07 PM, David Laakso wrote: The Creative Director is not happy. The left border is missing around his picture (bottom of center panel). http://www.chelseacreekstudio.com/index.html Thanks, ~dL I was running an old version of Camino (I am new to a Mac), and therein the problem. The issue is corrected in the latest version of Camino. Thank you to all who replied both on and off-list. ~dL PS And yes: I am a Blue's fan... -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Safari Overflow:Auto Issue?
Chris Davis wrote: On a newly developed site I recently got an email saying that the content on one page of the site only took up 10% of the screen: far too little to see! The page makes use of overflow:auto and the user is browsing with Safari on a Mac. Can anyone else see the problem and suggest fixes? The page is here: http://monna-vanna.com/cast/ And the CSS for that piece of content is simply: #cast { padding-top:5px; height:360px; overflow:auto } Thanks in advance! Chris Yes, this is to confirm that in Safari/2.0.4 the user's comment is fairly accurate. I regret I do not know the fix. You may want to validate the markup although this may have little or nothing to do with the issue at hand: same for the the fact that +2 font-scaling kind of does a number on the page in compliant browsers. Sorry. I am not able to bring more than a user's observation to help out... Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/