Re: [css-d] floating image question
Carol F. Swinehart wrote: http://www.controlledairsystems.com/test/ This css is working, but I now want to make the banner narrower by making the left picture smaller and floating the full size of the right picture over the edge of the banner so it hangs down. I assume you mean in IE, but you didn't say so. if the container the float resides in is given a width or height, it will aquire layout in IE and will then contain any float. To prevent this, you need to avoid giving that container layout, which means not using a width or height. Big John -- Perennial student + Impractical joker + CSS junkie = Big John http://www.positioniseverything.net __ Yahoo! Mail - PC Magazine Editors' Choice 2005 http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE layout issue - float problem possibly?
Jeff D. Chastain wrote: I am having problems with a layout design in IE. Everything works fine in FireFox and Opera, but IE as usual is the problem child. Once it is stripped down, the layout is a basic 2 column layout with the left panel set at 210px and floated left and the right panel set with a left margin of 210 px. The two panels work just fine and line up next to each other without issue. However, in IE, the content in the right panel (not the panel itself) gets skewed. http://www.admentus.com/prototype/administration/account/suppContacts.cfm This explains your main problem: http://nemesis1.f2o.org/aarchive?id=11 I don't have time to track down the shorter grey bar, issue, but try using this method: http://positioniseverything.net/articles/mys-bug.html Big John -- Perennial student + Impractical joker + CSS junkie = Big John http://www.positioniseverything.net __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] How can I center this menu:
Hello all, I have been having a heck of a time trying to figure out the best way to center this menu: http://www.l-c-n.com/IE5tests/phantom-links/inline-block_list.php The above menu works nicely in IE5 mac (avoids phantom links), Safari/Mac, Firefox/Mac, IE 5.5+/PC Any help would be greatly appreciated. :D Cheers, Micky -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Cree9.dk site check again
- Original Message - From: David Laakso [EMAIL PROTECTED] To: Mette Haahr [EMAIL PROTECTED] Cc: CSS-discuss list css-d@lists.css-discuss.org Sent: Sunday, October 30, 2005 2:15 AM Subject: Re: [css-d] Cree9.dk site check again Mette Haahr wrote: Now I just have a feeling that it is a boring design, but I guess it will feel like that, when you've been staring at the same design for weeks:o) The URL is here: http://www.cree8.dk/oktober/ny/c.shtml The css: http://www.cree8.dk/oktober/ny/ddmand.css It is not a boring design-- creative, and nice use of color. I have the feeling you are designing for yourself and IE. Design for your users. They will do outrageous things. For example: your content is difficult for me to read at 1280. The first zoom click in FF shoots the the text right out the bottom of the layout. Rule of thumb is code for good browsers, and hack IE. Have you tried centering the page horizontally? Best, ~dL When I first started out, I chose a fixed layout, but then I switched to a flexible layout, that would be readable in low resolutions without scrollbars and not break in higher resoultions. I was definitely designing for users - I also checked the effects on userdefined text sixes in the three different browses I have available. However - Missed the zoom in 1280 in Firefox. The layout should be flexible, but how come the text drops out of the wrapper?? I really am trying to design for users, everything else would be silly. However it is really difficult to make a bulletproof design for alle the variable insane things the users will do. Especially since browsers interpret css in many different ways. Any ideas on how to fix the problem? Thanks:o) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Font enlarger button
You may have seen on some sites a couple of small buttons. One enlarges text and one makes it smaller. I'd like to incorporate this into my website but havent found any tutorials discussing it. Was also thinking about having a style sheet switcher but not sure how to do it as well. Anyone know of any tutorials for these? Most of these are pretty useless as they simulate browser functionality. I have done one in the long long ago: http://www.onlinetools.org/tools/easydynfont.php A cleverer way is to put that on the server side: http://www.alistapart.com/articles/phpswitch/ Or offer a view that _really_ helps low vision users: http://www.joeclark.org/access/webaccess/zoom/ -- Chris Heilmann Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Binaries: http://www.onlinetools.org/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] is this a tabular data?
guys, what do you think if this kind of organizing data http://easyhttp.net/files/1.pdf - 17KB is it tabular data? or a list? -- Regards Jad madi Blog http://EasyHTTP.com/jad/ Web standards Planet http://W3planet.net/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] floating image question
Carol F. Swinehart wrote: http://www.controlledairsystems.com/test/ This css is working, but I now want to make the banner narrower by making the left picture smaller and floating the full size of the right picture over the edge of the banner so it hangs down. For a start: set that class=leftone on the image at the left side. Corrected CSS: #banner { text-align: left; margin-top: 0; background-color: #EEEADF; color: #003BB4; font-family: arial, helvetica, sans-serif; height:160px; padding-top: 1px; } #banner img.leftone { float: left; margin: -1px 0 -30px 0; } #banner img.imgabsolute{ z-index: 5; float: right; position: relative; margin: -1px 0 -30px 0; } #banner h1 { text-align: center; color: #003BB4; background-color: transparent; font-size: 18px; margin-top: 0;/* or what you like */ } ...is tested, and working as you want in IE6, Opera, Safari and Firefox. Those negative margin-bottom on floating images make it possible to hang them over the edge in IE/win - regardless of its layout-mess. Position: relative and a suitable z-index makes the right image visible all the way. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] is this a tabular data?
On 30/10/05, Jad Madi [EMAIL PROTECTED] wrote: guys, what do you think if this kind of organizing data http://easyhttp.net/files/1.pdf - 17KB is it tabular data? or a list? Tabular. Quickly thrown together example. Only tested in Firefox, I suspect it will break horribly in IE. http://dorward.me.uk/tmp/tabular.html -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] drop shadows
hi, This is a pretty newbie question so please bear with me. I am styling a blog using css (duh), its going pretty well so far, but I can't figure out how to add drop shadows to the edges of the divs. I'm not sure if I can edit much of the structure of the page (I'm using blogger). Any suggestions will be much appreciated. my page: test.btswami.com/blog.html what I want to acheive: http://test.btswami.com/blog-layout2.png thanks in advance regards, Bala Clark __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE Problem
Dear CSS Discuss I am sure this has been covered before but after many attempts to try and fix I now seek help. http://www.viewnewmedia.com/newid/english/home.php is the page in question. It displays as it should in Firefox but IE doesnt play ball. The header height is expanded - not sure if it is a height issue or a margin issue.. I may have missed something really obvious here but any pointers are much appreciated. Thanks Chris ___ Yahoo! Messenger - NEW crystal clear PC to PC calling worldwide with voicemail http://uk.messenger.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] drop shadows
Bala Clark wrote: I can't figure out how to add drop shadows to the edges of the divs. my page: test.btswami.com/blog.html what I want to acheive: http://test.btswami.com/blog-layout2.png Bala Clark Bala, This is one method for creating drop shadows for divisions: http://www.cssplay.co.uk/menu/shadow.html Best, ~dL -- David Laakso http://www.dlaakso.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] One final problem cree8.dk
Again, thanks for all your help. It seems I have one final problem, that I can't find a solution to in spite of googling for hours on end. http://www.cree8.dk/oktober/ny/c.shtml http://www.cree8.dk/oktober/ny/ddmand.css When I enlarge text size in Firefox, the text in my content div bleeds down over my footer and beyond. IE does what is is supposed to (!). Why does it do that and how can I fix it? Thanks in advance __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Problem
Remove - background-color : #FF; - from #container. Michael - Original Message - From: Chris Edwards [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Sunday, October 30, 2005 7:26 AM Subject: [css-d] IE Problem Dear CSS Discuss I am sure this has been covered before but after many attempts to try and fix I now seek help. http://www.viewnewmedia.com/newid/english/home.php is the page in question. It displays as it should in Firefox but IE doesnt play ball. The header height is expanded - not sure if it is a height issue or a margin issue.. I may have missed something really obvious here but any pointers are much appreciated. Thanks Chris ___ Yahoo! Messenger - NEW crystal clear PC to PC calling worldwide with voicemail http://uk.messenger.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One final problem cree8.dk
Mette Haahr wrote: http://www.cree8.dk/oktober/ny/c.shtml When I enlarge text size in Firefox, the text in my content div bleeds down over my footer and beyond. IE does what is is supposed to (!). Why does it do that and how can I fix it? Correct content-container to look exactly like this: #content { padding:20px; background-color: #F0EFD1; border-right-style: dotted; border-right-width: 2px; border-right-color: #9A; display: table; } regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One final problem cree8.dk
Correct content-container to look exactly like this: #content { padding:20px; background-color: #F0EFD1; border-right-style: dotted; border-right-width: 2px; border-right-color: #9A; display: table; } regards Georg WOW! It works!!! Thank you! Now, why does it work?:o) It seems I have finally achieved a good flexible layout, and I could not have done any of this without you :o) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE layout issue - float problem possibly?
Big John - Thanks. It turned out to be the 100% width inside of the float that was causing the problem. The Holly Hack took care of both issues. Thanks again, -- Jeff -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Big John Sent: Sunday, October 30, 2005 1:40 AM To: Jeff D. Chastain; css-discuss Subject: Re: [css-d] IE layout issue - float problem possibly? Jeff D. Chastain wrote: I am having problems with a layout design in IE. Everything works fine in FireFox and Opera, but IE as usual is the problem child. Once it is stripped down, the layout is a basic 2 column layout with the left panel set at 210px and floated left and the right panel set with a left margin of 210 px. The two panels work just fine and line up next to each other without issue. However, in IE, the content in the right panel (not the panel itself) gets skewed. http://www.admentus.com/prototype/administration/account/suppContacts. cfm This explains your main problem: http://nemesis1.f2o.org/aarchive?id=11 I don't have time to track down the shorter grey bar, issue, but try using this method: http://positioniseverything.net/articles/mys-bug.html Big John -- Perennial student + Impractical joker + CSS junkie = Big John http://www.positioniseverything.net __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS Rendering in Flock
Dear All: I've just installed Flock 0.49[4], a browser which is based off Firefox[5]. It implements it's various features fairly slickly, but I really wanted to see whether there were significant rendering differences between Flock and Firefox. I've created some screenshots of the Acid 2 test - here is Firefox [1], and Flock[2]. As you can see, there is a small ~2px gap in FF, which does not appear in Flock. Furthermore, a quick check on one of my recent sites, shows a problem on this page[3]. The background image, sticks to the top of the viewport, rather than moving down, as Firefox does. I noticed this in Opera as well. I'm sure these are merely differences in which stable version of FF Flock is based off - I don't know if any of the Flock developers are on this list - John Hicks? - but I haven't been able to find this information. From the Flock FAQ: We are building on top of the Mozilla platform, which we believe to be a very secure foundation. This is about all the information I have been able to find. Anymore ideas, any more ways to perform tests? Should we not be worried about a preview release browser? I hope this is not too off-topic. Thanks - I look forward to the responses. Rahul. [1] http://www.flickr.com/photos/[EMAIL PROTECTED]/57505037/ [2] http://www.flickr.com/photos/[EMAIL PROTECTED]/57505074/ [3] http://elasticjohn.com/music/ [4] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.12) Gecko/20050915 Firefox/1.0.7 [5] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b5) Gecko/20051021 Flock/0.4 Firefox/1.0+ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] another margin problem?(IE) - mac users plz sitecheck
Hi everyone, My first site with CSS. So i'm still pretty new and I'm sure i made some mistakes.. perhaps there are better ways doing it, any suggestion is welcome! (Also still don't know what do with the 'gallery' link, but this is a CSS mailling list...) Now my problem is in IE you see like 20 or more pixels to the margin(i think?) of the #container, the image is not lining up with the redish background, and it does in Firefox. sry for the popup from the free host. the site is here: http://e.domaindlx.com/lowenf/lj/index.html CSS file is here: http://e.domaindlx.com/lowenf/lj/style.css hope anyone can help me out here! gr, Lowen __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How can I center this menu:
Michael Hulse wrote: Hello all, I have been having a heck of a time trying to figure out the best way to center this menu: http://www.l-c-n.com/IE5tests/phantom-links/inline-block_list.php Try this: 1. Do not float the UL, 2. Give the UL a width in em (just enough so list items do not wrap), 3. Set the margin to 0 auto Thierry | www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] site check
hi, Earlier I asked for help with getting drop shows on my blog, I've solved that problem now and would appreciate some feedback on the design. I've simply modified one of the defaut blogger.com stylesheets with my own css. Right now it seems a little too blue, any other opinions? heres the url: http://nandasunu.blogspot.com/ thanks. Bala Clark __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] background color warnings
Don't sweat the questions as they're good ones. The warnings about colors there are simply warnings as you already know. They're simply saying, 'hey, you're only setting {colour/background colour}. If you inhereit the {background colour/colour} from an ancestor and it's the SAME colour, or simply a hideously contrasting one, things will go snafu. So it's just a way of getting you to think about your design scheme. The selectors you mention are different: div#summary p #summary p p#summary The first is: a p within a div with the id of summary. The second is: a p within anything with an id of summary. The last is any p with an id of summary. Since both p and div are block level, I leave it up to you to think about why Eric Meyer wouldn't bother with an extraneous div tag. -Michael From: Trish Meyer [EMAIL PROTECTED] Subject: [css-d] background color warnings To: css-d@lists.evolt.org Message-ID: [EMAIL PROTECTED] Content-Type: text/plain; charset=us-ascii ; format=flowed I get the following warningsa about background color: * Line : 42 (Level : 1) You have no color with your background-color : div#utilnav * Line : 78 (Level : 1) You have no color with your background-color : div#sidebar * Line : 92 (Level : 1) You have no background-color with your color : #profile * Line : 92 (Level : 1) You have no background-color with your color : #profile * Line : 161 (Level : 1) You have no background-color with your color : a:link * Line : 165 (Level : 1) You have no background-color with your color : a:visited * Line : 169 (Level : 1) You have no background-color with your color : a:hover etc etc etc etc...it goes on... Am I doing something wrong in the CSS that can be easily fixed, or do I need to specify the background color explicitly in each style mentioned? The CSS is at http://www.wildscaping.com/stylesheets/ws_stylesheet3.css --- Also, is there any difference between div#summary p #summary p p#summary I noticed Eric Meyer was using the 3rd option (p#summary) in a tutorial, and I'd never seen it done this way. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] site check please - Ekstasis.net
SiteCheckPlease CheckEkstasis http://ekstasis.net/ http://www.ekstasis.net/ I'm trying to learn CSS and would really appreciate a site check. I've validated xhtmlcss + links. Any tips for fixing the following would be most handy: On the index page: 1. I cannot get a flash movie to position correctly on the horizontal in Firefox which is positioned as a list item within a 'expanding 'menu' box' (similar to [TheManInBlue]) within a (white) box within an elastic central container section. Only the (white) box and the expanding 'menu' box has padding. 2. The scrollbar in the small lower scrolling box does not work in Firefox unless you nudge it up with the top arrow then move the bar down. On other pages: 3. I cannot get Eric's 'box-punch' cut-outs which house the icon for external/internal links to position correctly on the vertical in Firefox. I've included them as classes within un-ordered list items on most pages. In the My blog section (in My sources area - see jar menu): 4. I cannot get the positioningiseverything geckofix layout to work with the 456 BereaSt flexible custom corners in IE. I'd also like to fix the horizontal menu to the right hand side of the screen. I've created the site to help me develop my skills and maybe get a better job. Many thanks in advance. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE6 border color change on refresh
Hi Big John, On Oct 29, 2005, at 12:06 AM, Big John wrote: http://coawfl.appriver.com/press-room.asp IE's way of dealing with lists can be incredibly bizarre, but I bet that giving the links the same width as the LI's might solve the problem, altho it also might cause changes in spacing. Thanks for looking at this. Adding width to the links didn't change the spacing, but it didn't seem to fix the problem - I'm still seeing the weird borders on refresh. Any other thoughts as to why this might be happening or how it could be fixed? Thanks! Kara __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Strange line appearing in IE6
All: I have a line (a graphic) that appears in IE6.0, at a site I'm developing at: http://dsctest.com/test2/index.php The CSS file is at: http://dsctest.com/test2/style.css There is a background image (http://dsctest.com/test2/images/ menu_bckgnd-1.gif) which seems to be leaking below the menus. I've tried whatever I can think of, such as changing the background image size and {background-repeat: repeat-y} to no avail. It all looks OK in Safari 2.0. Is this an example of the infamous box problem? Should I be defining the height better? I suspect this is a newbie question, so please don't beat me up too much if that's so as this is only my second CSS project. Regards, Paul Pollock WebCars! Webmaster http://web-cars.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check
Bala Clark wrote: hi, Earlier I asked for help with getting drop shows on my blog, I've solved that problem now and would appreciate some feedback on the design. I've simply modified one of the defaut blogger.com stylesheets with my own css. Right now it seems a little too blue, any other opinions? heres the url: http://nandasunu.blogspot.com/ thanks. Bala Clark I will speak to Bowman regarding his font-size methodology. ~dL -- David Laakso http://www.dlaakso.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] another margin problem?(IE) - mac users plz sitecheck
Hi, thanks for your reply.. but it does not seem to work. I uploaded it with the display: inline, but nothing changed.. On 10/30/05, D Ross [EMAIL PROTECTED] wrote: Add display: inline to the #container in the css. It will fix ie's double margin and not hurt anything else. Now my problem is in IE you see like 20 or more pixels to the margin(i think?) of the #container, the image is not lining up with the redish background, and it does in Firefox. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] another margin problem?(IE) - mac users plz sitecheck
Lowen Fan wrote: I uploaded it with the display: inline, but nothing changed.. You just defined it on the wrong element. Look for the element with margins, that is pushing the container-width from the inside in IE/win... Setting this: #contact {display: inline;} ...will fix the margin-doubling bug in IE/win. Safari and IE/Mac is OK BTW. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Show hide layers
Hi, I'm making a site right now and have to put a option to language and I have tried to create in the same place three layers containing each one of the texts in portuguese, english and spanish. This links when clicked need to show the preferred language e hide the others, Would like to now how can I do that? Thanks -- Alessandro N. Cordeiro Designer Gráfico e Ilustrador (31) 3452-0717 (31) 9715-0717 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Show hide layers
Alessandro Cordeiro wrote: Hi, I'm making a site right now and have to put a option to language and I have tried to create in the same place three layers containing each one of the texts in portuguese, english and spanish. This links when clicked need to show the preferred language e hide the others, Would like to now how can I do that? Thanks Google is your friend: http://www.devx.com/tips/Tip/13638 for some basic info and pointers. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Rendering in Flock
From the Flock FAQ: We are building on top of the Mozilla platform, which we believe to be a very secure foundation. This is about all the information I have been able to find. Anymore ideas, any more ways to perform tests? Should we not be worried about a preview release browser? I've been testing Flock too. It's almost identical to Mozilla as of now, but there is some concern among developers and users that Flock might not keep up with the latest versions of Mozilla. I'm almost expecting it. I think the best indication of what the Flock team will do will come after FF 1.5 is released. If they do care, they will update Flock to match FF 1.5... if they don't, then I'll be concerned. As of now it looks like the Flock team are not standardistas, I hope they are. -- -- C Montoya rdpdesign.com ... liquid.rdpdesign.com ... montoya.rdpdesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Auto Positioning
I'm working on a new entirely CSS-based design, and I'm having a problem with the footer. I have it positioned at the bottom of the page, of course, and right above it are the content and sidebar divs, whenever content overflows from the content div it overlays the footer making a really ugly-looking strip on the page where two layers of text are fighting for visibility. A pic of this happening is at http://ambit-online.net/images/overflow.jpg. I need to be able to have the footer's position change automatically depending on if content from the content div overflows or not. -- Ryan __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] background color warnings
On 10/30/05, Trish Meyer [EMAIL PROTECTED] wrote: Also, is there any difference between div#summary p #summary p p#summary They select different things: The first selects any P element which is a descendant of a div with an id of 'summary' The second removes the restriction on the container being a div - if you had td id=summary it would also work. The third selects a single paragraph which itself has an id of summary and is not interchangable with the first two. -- Richard Grevers New Plymouth, New Zealand Orphan Gmail invites free to good homes. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS Rendering in Flock
On 10/31/05, Rahul Gonsalves [EMAIL PROTECTED] wrote: Dear All: I've just installed Flock 0.49[4], a browser which is based off Firefox[5]. It implements it's various features fairly slickly, but I really wanted to see whether there were significant rendering differences between Flock and Firefox. I'm sure these are merely differences in which stable version of FF Flock is based off - I don't know if any of the Flock developers are on this list - John Hicks? - but I haven't been able to find this information. [4] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.12) Gecko/20050915 Firefox/1.0.7 [5] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b5) Gecko/20051021 Flock/0.4 Firefox/1.0+ You answered your own question: The dates of the builds used are the numbers following Gecko in the UA string. So Flock is currently using a newer build (21st October) than Firefox. -- Richard Grevers New Plymouth, New Zealand Orphan Gmail invites free to good homes. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] fixing backgrounds
Made an index.html with some beautiful pictures. Got the idea from Eric Meyer, chapter 12 of his first book from Eric Meyer on CSS, I hope a lot of them will follow. The power of a fixed background worked perfect in safari and IE5/Mac. When i opened it in IE6 on windows one picture was partly on a black background of the body the other was placed in the content part but not overlapping the other. In the content part the picture was also placed relative to the border on the content part. Hope this makes the problem clear, I am definitely a newbie in this field so bare with me. Does IE6 on windows need a css hack, could not find one?? Or can someone direct me in a direction?? Thanks walter __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Put gap in list styled for navigation IE problems
First - big thanks to everyone who replied on this one (see below). In the end I went with two lists, seemed most correct and put a margin-bottom in to separate them. However, when I view this in IE6/XP, the line dividing the top two links disappeared. everything else checks out fine - but no line there. I can't see anything in there to cause this, and it doesn't happenn FF/NN. If anyone could suggest a fix, I'd get them a latte. Site launch is on Monday ;-) Link: http://www.digitalbeginnings.shef.ac.uk css: http://www.digitalbeginnings.shef.ac.uk/css/index.css I've tried to keep the code fairly clean and easy to read. let me know if you think not. TIA Paul P.S.: Apologies to Steve for sending this to him instead of the list. A slip of the mouse. Steve Clason wrote: On 10/26/2005 6:01 PM Paul Jinks wrote: I've got a ul that I've styled as a nav bar. Fine. My client has now asked to have a gap the width of 1 list item to separate the last two list items as they are links to external sites. If you want to take a look, go to: http://www.digitalbeginnings.shef.ac.uk snip I'm missing something really obvious, right. But what? I believe I'd go with two lists. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Put gap in list styled for navigation IE problems
First - big thanks to everyone who replied on this one (see below). In the end I went with two lists, seemed most correct and put a margin-bottom in to separate them. However, when I view this in IE6/XP, the line dividing the top two links disappeared. everything else checks out fine - but no line there. I can't see anything in there to cause this, and it doesn't happenn FF/NN. If anyone could suggest a fix, I'd get them a latte. Site launch is on Monday ;-) Link: http://www.digitalbeginnings.shef.ac.uk css: http://www.digitalbeginnings.shef.ac.uk/css/index.css I've tried to keep the code fairly clean and easy to read. let me know if you think not. This is what I did: #sidenav li { list-style-type: none; margin: 0px; text-align: center; padding: 0; display: block; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #ccc; color: #036; width:100%; /* SEE THIS? */ } Did that work? -- -- C Montoya rdpdesign.com ... liquid.rdpdesign.com ... montoya.rdpdesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] css problem with margin between header and content - take a look please
http://www.controlledairsystems.com/test2/indexb.php I have done this site in several iterations but none really works the way I want. Right now I am very close but there is this big chasm between the lower brown bar and the navagation and content section. Might as well be a glacial chasm. I have tried everything to close the gap but just can't seem to find a way. I would settle the navagation to the bottom brown bar and the beige bar white. I could them put more text on top of the header picture and all would work. I tried a background in the header instead of two pictures (still have one and that helped but now I can't seem to move the navigation up without weird things happening. As you can see in IE there is an extra line. This color is coming from the header background - how do I get rid of this Changing the header background causes other issues. How do I get the navagation to move up to the lower brown line without breaking up. To those who gave suggestions to my last iteration. Thank you very much. Things did not work out - other things separated. Carol F. Swinehart CKFS Web Pate Design, LLC __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Suckerfish blues (again)
I have implemented a suckerfish menu for a redesign of a game site. However every implementation I come up with works fine in FF and Opera8, but fails in IE6 (only tested on Windows). I also used the block image code which I was having trouble with last week (thanks for the help). The test site is here: http://homepage.ntlworld.com/graham.reeds/space and the css is here http://homepage.ntlworld.com/graham.reeds/space/styles/space_styles.css Originally I grouped all the menu images into one. This partially worked, but had problems with the items being differing heights: The items were between 13 and 21 pixels in size but the items were only partially selectable because the text doesn't fill it entirely. So I then thought about adding a top and bottom li for the menu border and making all the items in between the same size. However this causes the top (and the bottom) image to be drawn in correctly due to IE deciding that the size you want it be cannot be any smaller than the font-size (in this case around 10px). Add font-size: 5px to the top list-item and a similar one to the bottom and it starts to render correctly in IE, FF and O8. Now I am happy that it is rendering correctly, but am unhappy about the hack. Why does it do this and is there a cleaner work around? Also I have noticed that it is very slow updating when I am checking the site when hosted on my homepage. Does anyone else see this sluggishness in IE6? Any ideas on that as well? Thanks, Graham Reeds. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Rounded corners - rounding errors in IE
I'm working on a site in which various sections will have different background colors on body with content boxes having white backgrounds. These boxes are to have rounded corners, will be various sizes (both fixed and fluid, static and floated), and some will have content which should be 100% of the box height. Fortunately, the boxes do not have borders. Because of the colour changes, I'd like to achieve the roundy corners with as few images as possible, ideally with one image such as http://www.dramatic.co.nz/testing/corner_green.png I want the images to be css backgrounds only for consistent results with styling off. So far I've been using a floated element at top right and absolute positioning for the two bottom corners (the full height content requirement). This is working well in everything tried on Windows except for IE, which is suffering from random 1px errors. e.g. on one box the bottom right image might be 1px too high, on another it might be at the correct height but 1px too far left. My fluid element seems to be working fine. Does anyone know of a method which avoids these errors? I wouldn't have thought there was a lot of calculation involved with fixed size elements. XHTML div id=foospan class=tr/span h2Heading/h2 pblah blah/p p blah blah could be floated content or all sorts of things./p span class=bl/spanspan class=br/span /div CSS * { margin:0; padding:0; } #foo{ /*this particular example is fixed-size*/ position:relative; width: 275px; height: 360px; margin: 10px;float: left; background:#fff; } #foo h2 { font-family: geneva,arial,'lucida sans', sans-serif; color:#fff; background: url(../img/foo_h2.png) no-repeat; text-align: center; position: relative; top: -7px; left: -7px; width: 225px; height: 30px; font-size: 21px; line-height:28px; } #foo p { margin: 8px; } .tr { display:block; float:right; background: url(../img/corner_green.png) bottom left no-repeat; width: 15px; height: 15px; vertical-align: bottom;font-size:1px;line-height:1px; } .bl {display:block; position:absolute; bottom:0;left:0; background: url(../img/corner_green.png) top right no-repeat; width: 15px; height: 15px; vertical-align: bottom;font-size:1px;line-height:1px; } .br { display:block; position:absolute; top:100%;right:0; background: url(../img/corner_green.png) top left no-repeat; width: 15px; height: 15px; vertical-align: bottom;font-size:1px;line-height:1px;margin-top:-15px; /* using bottom:0 also produces random errors in IE */ } -- Richard Grevers New Plymouth, New Zealand Orphan Gmail invites free to good homes. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE6 border color change on refresh
Kara Taylor wrote: Hi Big John, On Oct 29, 2005, at 12:06 AM, Big John wrote: http://coawfl.appriver.com/press-room.asp IE's way of dealing with lists can be incredibly bizarre, but I bet that giving the links the same width as the LI's might solve the problem, altho it also might cause changes in spacing. Thanks for looking at this. Adding width to the links didn't change the spacing, but it didn't seem to fix the problem - I'm still seeing the weird borders on refresh. Any other thoughts as to why this might be happening or how it could be fixed? Kara, I somewhat managed to reproduce the problem locally (after refreshing the cache a couple of times, reloading, refreshing ... and opening several instances of IE6). The problem is that we cannot identify a trigger locally that might cause the bug after several refreshes only. The good news is that the color of the 2px dotted border is not changing, so you could safely ignore this !important on the border color. The bad news is that the problem affects the space between the border dots. I have changed the colors of the logo.gif and the colors and widths in the CSS for contrast (gray dots, black background). Screenshot: http://www.satzansatz.de/cssd/bizarre/kara5.png In line 1 and 3 there are colored pixel filling the space between the gray dots. Note that these are parts of different transparent gifs you are using on the page. In the first line, there are some green spots, and the third line there are parts of the logo.gif (to the left) and from the headline.gif (to the right). How bizarre. Here, I have used a couple of lines this way to simulate a screen: http://www.satzansatz.de/cssd/bizarre/bizarrebug.html Screenshot: http://www.satzansatz.de/cssd/bizarre/bizarre.png (http://www.satzansatz.de/cssd/bizarre/bizarre.jpg) A list entry with a dotted border-bottom and a transparent background-gif and padding-bottom seems to be all what is needed to mirror the video memory between the dots? Is this a variant of the creeping text bug [1]? Strange one. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Bill Gates wrote: I don't know whether you care or not, but it doesn't work right on OS X, Firefox or Opera. IE5.2 is hopeless, as well. On Oct 30, 2005, at 7:26 PM, Graham Reeds wrote: http://homepage.ntlworld.com/graham.reeds/space Is that on just the 'main' menu or you saying for all of them? Only the main menu has been implemented. No point in coding up the rest until I have one of them working. Really I would like a fix or a more elegant workaround for the font-size hack, and why IE6 is really slow compared to FF and Opera when the page is remote. Also do other people see it as being really slow. Also I don't really care about any browser less than a couple of years old, and IE5.x on both Mac and Windows is really a dying breed. For Mac I only really care about Safari, FF Opera, but I don't have access to a Mac for continuous testing, so I hope that FF and Opera will be like their Windows counterparts. Safari, I hope, will be quite compliant (it seems to be) so I hope the rendering will be similar to FF (and therefore work). Thanks, Graham. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Suckerfish blues (again)
Linda H wrote: IE5.x on both Mac and Windows is really a dying breed. Don't I wish! Unfortunately, some 95% of the people accessing the site I'm working on are using IE and the people in charge don't take kindly to me telling the users they should download Firefox in response to complaints :-( Linda H Let me get this straight. 95% of people accessing your site use IE5.5 or less on both Windows and Mac, so the remaining 5% is distributed amongst IE6, FF, Opera, Safari, etc.? Last time I checked 95% of users used IE6 FF. The remaining 5% is distributed amongst IE5 (the most at around 3%) and Safari, Opera being the more significant of the others. G. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Assistance Needed
Hi, I know this is off topic, but didn't know where else to go. One of my websites has been hacked by the 'byond crew'. They've changed the index page, the rest of the site it there though. I've contacted my host provider here in the UK, but it's 3:40am here and I don't think there's anyone there. If anyone knows of anything I can do myself, then please contact me off list. Cheers, Tracy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] div problems
I cant seem to get div to work while trying to use absolute positioning. Im readin two css books right now core css and css web design for dummies and both have code snippets for this and it doesnt work right for me in firefox or ie6! wtf is going on? TIA, mrk0de __ Yahoo! Mail - PC Magazine Editors' Choice 2005 http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] div problems
Hard to tell without some code to look at. Be sure the containing div is not static. The containing div should include something like: {...position: relative...} for example. Jim On 10/30/05, meeester kode [EMAIL PROTECTED] wrote: I cant seem to get div to work while trying to use absolute positioning. Im readin two css books right now core css and css web design for dummies and both have code snippets for this and it doesnt work right for me in firefox or ie6! wtf is going on? TIA, mrk0de __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Assistance Received, thanks.
Thank you to those who were awake at this hour and online to come to my assistance. Sorry to have posted Off Topic, but I was desperate! Cheers, Tracy On Monday, October 31, 2005, at 03:45 am, Tracy Shorrock wrote: Subject: Assistance Needed __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] left margin on styled list in IE
Hi folks, I've got a chunk of page that renders as I expect in firefox, but shows a big offset in ie. I can't seem to find where it's coming from. The page is at http://dsdd.org/vorivore-cart-down-mock.html In the cart at top, the short descriptions (class=desc) should be about 18 pixels from the left border, and indeed in firefox they are. Internet explorer is shifting the whole works right by some 50 or 60 pixels. It's even overflowing the cart borders. A further problem, but one that has little to do with css, is that the DHTML cart show/hide fails horribly on IE. Thanks for any suggestions or input! -Jim __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/