Re: [css-d] RE_POST: Problem with table or div dimensions
Reymier, On Apr 5, 2006, at 1:15 AM, Reynier Perez Mira wrote: Yes, there you take a look at: http://valencia.ch/simpro/sample_v1.html http://valencia.ch/simpro/sample_v2.html http://valencia.ch/simpro/sample_v3.html -- 8 -- This are three different versions. I need to pass it from tables to DIV but need help because the TABLE maquette is too complicated for me. So .. On Apr 2, 2006, at 3:11 AM, Reynier Perez Mira wrote: Hi to every: I have a table an inside a TD element I have a DIV. Now the problem is when text is too long the page is distort and not look well. I probe in this two ways: - 8 --- I'm a little behind reading my email, but I did not see any replies. I'm not sure I fully understand your question. It would be easier to understand if there was a sample page to work with. Can you send us a url to your test page? You are correct to want to stop using tables for layout. Your sample template is a typical 3 column layout with header. There are many mentioned in the list wiki http://css-discuss.incutio.com/?page=ThreeColumnLayouts Some of them have very nice explanations about how they were done. Spend some time reading about them and pick one to adapt to your needs. As you do, you will have questions. Post them to the list and we'll help you out along the way. When I switched from tables to css layouts I tried to do it a little bit at a time. That didn't work. It is faster to throw away the layout tables and go straight to css layouts. It means thinking in a different way and the two don't mix well. I hope that makes sense and gives you a place to start. -- Roger Roelofs __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] son of suckerfish problems, please help
Schalk wrote: Hey there All! Please have a look at this page in IE: http://www.epda.cc/joomla/ Why is the technique from here: http://www.htmldog.com/articles/suckerfish/dropdowns/ not working? It actually is working, only the dropdowns are hidden behind div#content-pane. I think you have to do something with z-index maybe :-) -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] son of suckerfish problems, please help
It worked for me in spanish ;-) http://platea.cnice.mecd.es/~jmas/manual/html/suckerfish.html On 05/04/06, Els [EMAIL PROTECTED] wrote: Schalk wrote: Hey there All! Please have a look at this page in IE: http://www.epda.cc/joomla/ Why is the technique from here: http://www.htmldog.com/articles/suckerfish/dropdowns/ not working? It actually is working, only the dropdowns are hidden behind div#content-pane. I think you have to do something with z-index maybe :-) -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Is there a way to simulate smthg. like float: center on images...
Hello List, Is there a CSS way of having an image in the middle of a paragraph whose text wraps around both sides of the image: word, word, word, word, word, ### word, word, # # word, word, # img # word, word, # # word, word, ### word, word, word, word, i.e. like one could expect the made-up property float: center to behave... Many Thanks André Huf __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Is there a way to simulate smthg. like float: center on
Is there a CSS way of having an image in the middle of a paragraph whose text wraps around both sides of the image: In my opinion, it is not very good idea, beacause the reader must follow the line across the image. But may be the example [1] from Ingo Chao [2] could be helpfull. [1] http://www.satzansatz.de/cssd/tmp/floatspacer.html [2] http://www.satzansatz.de/ Have a nice day! -- {U}()Cimo Michal Cizmazia __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is there a way to simulate smthg. like float: center on
Michal Cizmazia wrote: Is there a CSS way of having an image in the middle of a paragraph whose text wraps around both sides of the image: In my opinion, it is not very good idea, beacause the reader must follow the line across the image. But may be the example [1] from Ingo Chao [2] could be helpfull. [1] http://www.satzansatz.de/cssd/tmp/floatspacer.html [2] http://www.satzansatz.de/ That's two columns though - having images in the middle of a paragraph isn't possible afaik. -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problem with the Header
Hello, this my page http://www.independza.com/client/expay/index.html I have a problem with the header on IE 6. Header goes to right side ;( my code div id=header ul li class=courantACCEUIL/li liCHANGER VOTRE ARGENT/li liDISTRIBUTEURS/li liSITES MARCHANDS/li liF.A.Q/li liCONTACT/li/ul img class=milieu src=images/anonyme.jpg alt=flash /!-- -- h1 a href=http://www.expay.org; title=Expay : La Révolution est en marchespanExpay : La Révolution est en marche/span/a/h1 /div /* /* HEADER /* */ #header { background-image: url(../images/background_header); background-repeat: repeat; width: 100%; padding:0; height:199px; } #header h1 { height: 69px; background-image: url(../images/logo.gif); background-repeat: no-repeat; margin:20px 20px 0 20px; position:absolute; padding:0; width: 69px; } #header h1 span { padding:0; margin:0; display: none; } #header ul { margin:45px 0 0 100px; padding:0px; display: inline; font-size:11px; color:#fff; float:right; position:absolute; } #header ul li { margin-left: 0; margin-bottom: 0; padding: 2px 15px 5px; list-style: none; display: inline; color : #fff; } #header ul li.courant { background:#FFB300; color:#000; list-style: none; display: inline; font-weight: bold; } .milieu { position:absolute; padding:0; margin:60px 0 0 20%; float:right; } Thanks for your help Bolo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with the Header
Bolo Michelin wrote: http://www.independza.com/client/expay/index.html I have a problem with the header on IE 6. Header goes to right side ;( Since you are using 'text-align: center;' on body, you should also add... #header {text-align: left;} ...to help IE line up those absolute positioned elements from the left. Now it is centering the first element, and lining up the other element to the right of it. It would be a good idea to add real positions in the form of 'left: (value); top: (value);' for absolute positioned elements. That would also fix the issue at hand, and reduce the amount of guesswork for all browsers. BTW: an absolute positioned element doesn't float anywhere. See... .milieu. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Is IE 6.0 reading well my CSS or I am mistaken?... :)
OK, here's the link: http://lelion.info/web/cantarco/ Here's the CSS; http://lelion.info/web/cantarco/css/master.css I'm now basically playing with fluid design. Both columns have width specified in percentages. This is not final version, I can even migrate to fixed-width later, if liquid proves impossible on IE. So, IE does not understand my styles, or I am doing it all wrong... FF, Opera are OK (on Windows). In IE at the right, all is wrong - when you resize your browser, at SPECIFIC sizes of the window, there's a 1 pixel DIFFERENCE at top right and top bottom, horizontally, between the backgrounds... Just try to slighly resize your window... And there's a horizontal scrollbar??? All is specified - margins, padding, absolute containers inside relative ones... If someone will give me an idea, I will be very grateful:))) Worst case, I drop liquid and make it good ol' fixed style:) Michel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Subject: Re: son of suckerfish problems, please help
Els wrote: It actually is working, only the dropdowns are hidden behind div#content-pane. I think you have to do something with z-index maybe :-) I just had the same problem...try adding a z-index and relative position to the #nav ul id: #nav, #nav ul { margin:0; padding:0; background-color:#f5d9a3; border-top:1px solid #fff; border-bottom:1px solid #fff; list-style:none; height:1.7em; z-index: 1; position: relative; } Debbie __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FF Page shift when scroll bar appears
Roger Roelofs wrote: Walter, On Apr 4, 2006, at 8:10 PM, Walter Max wrote: I'm seeing a slight shift of a page in FF that I don't see in IE when the extra content of a page causes a vertical scroll bar to appear. IE/win never removes the scroll bars, ff and other browsers do. Short pages get longer over time, so I usually ignore the problem knowing it will go away soon enough. If you have to fix it, you can set html and body to min-height: 100%; and add a pixel of padding-bottom to body to force a scroll bar at all times. I personally don't care about the page shift, and think it's preferable to always having a vertical scrollbar. Nevertheless, I wrote a short article on how to get rid of it -- both on your site, and on all sites you visit with FF. http://www.communitymx.com/abstract.cfm?cid=528A0 Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is IE 6.0 reading well my CSS or I am mistaken?... :)
Michel Bozgounov wrote: http://lelion.info/web/cantarco/ So, IE does not understand my styles, or I am doing it all wrong... In short: IE is buggy :-) A bit of cross-browser stabilization should help. 1: add... #maincol {display: inline;} ...to kill that 'margin-doubling on floats' bug in IE. The bug makes the right float-margin take up 3% more space than it should, at the moment. 2: add... #leftcol {margin-right: -10%;} ...to provide slightly more to go on before IE drops the #maincol float on narrow windows. 3: put something real inside the clearer... div class=clear!--clears leftcol and maincol--/div ...as only a comment makes it empty, and unstable as clearer, in IE. This is better... div class=clear.!--clears leftcol and maincol--/div ...with that '.' inside. --- I'm not all that good at counting single pixels, but I don't think I've lost any ;-) regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] margins problem
Hi, I'm experiencing a margin problem on this page: http://esion.textdriven.com/gardakom there are other things to set up but right now I'm bothered about the margin you see between the top-content center-content and bottom-content. The margins are setted to zero... but only if I set up a border (to all the three divs) the margins disappear. I've googled but I didn't found an answer. Thanks, Enrico -- The only thing necessary for the triumph of evil is for good men to do nothing Edmund Burke __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Subject: Re: son of suckerfish problems, please help
Iorhael wrote: Els wrote: It actually is working, only the dropdowns are hidden behind div#content-pane. I think you have to do something with z-index maybe :-) I just had the same problem...try adding a z-index and relative position to the #nav ul id: #nav, #nav ul { margin:0; padding:0; background-color:#f5d9a3; border-top:1px solid #fff; border-bottom:1px solid #fff; list-style:none; height:1.7em; *z-index: 1; position: relative; *} Debbie Thanks Debbie, Setting the z-index to 2 and position to relative for #nav, #nav ul did the trick. Now I only wish I knew why this happened in the first place. Is it a known bug in IE? -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Newbie with CSS layout
Hola a todos: I found some CSS layout in this site: http://blog.html.it/layoutgala/. Now I have my CSS layout but this have many problems. The sample is at this adress: http://www.valencia.ch/simpro/sample4.html http://www.valencia.ch/simpro/css/simpro_ga4.css http://www.valencia.ch/simpro/css/simpro_ie4.css As you can see this layout have a lot of problems and I need fix with your help. The table version is here: http://valencia.ch/simpro/sample_v3.html http://valencia.ch/simpro/css/simpro_ga3.css http://valencia.ch/simpro/css/simpro_ie3.css This is how the layout be at end. I'm playing a little with CSS to make possible positioning the right lateral menu, beside principal header. The CSS is like simpro_ga4.css but with this changes: div#header_img_top { background: url(../images/simpro_r1_c1.jpg) no-repeat; line-height: 213px; width: 566px; vertical-align: top; float: left; } div#menu { width: 194px; float:left; } The HTML is this: div id=header div id=header_img_topnbsp;/div div id=header_img_downnbsp;/div div id=menu div id=menu_item_1¿Quiénes somos?/div div id=menu_item_2¿Qué hacemos?/div div id=menu_item_3Noticias/div div id=menu_item_4Foros de Discusión/div div id=menu_item_5Libro de Visitas/div div id=menu_item_6Galería de Imágenes/div /div /div As you can see this not solve my problem so if any can help me with that I'll be very grateful forever. Note: All this changes only take effect in FF but in IE everything goes wrong, then when I finished with FF I start with IE or this is a bad way to think. Salu2 -- ReynierPM 4to. Ing. Informática Linux User: #310201 El programador superhéroe aprende de compartir sus conocimientos. Es el referente de sus compañeros. Todo el mundo va a preguntarle y él, secretamente, lo fomenta porque es así como adquiere su legendaria sabiduría: escuchando ayudando a los demás... -- ReynierPM 4to. Ing. Informática Linux User: #310201 El programador superhéroe aprende de compartir sus conocimientos. Es el referente de sus compañeros. Todo el mundo va a preguntarle y él, secretamente, lo fomenta porque es así como adquiere su legendaria sabiduría: escuchando ayudando a los demás... __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] margins problem
Enrico Teotti wrote: Hi, I'm experiencing a margin problem on this page: http://esion.textdriven.com/gardakom there are other things to set up but right now I'm bothered about the margin you see between the top-content center-content and bottom-content. The margins are setted to zero... but only if I set up a border (to all the three divs) the margins disappear. I've googled but I didn't found an answer. Looks like standardized 'Collapsing margins'... http://www.w3.org/TR/CSS21/box.html#collapsing-margins ...and IE/win gets it wrong - as usual. You may use top and/or bottom 'padding' of 1px instead of 'border' on those containers. If you find it necessary to correct for this padding, then a negative 'margin' top/bottom of -1px will cover up for it. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] min-height in IE
Hi I know that the min-height property is not supported in IE, but does any one have an idea how I can best get round this problem? Thanks very much Martyn __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] min-height in IE
On 4/5/06, Martyn [EMAIL PROTECTED] wrote: Hi I know that the min-height property is not supported in IE, but does any one have an idea how I can best get round this problem? one method: /* this style gets sent to all browsers, but ie doesn't get it */ .class-name {min-height: 10em;} /* the following tells non-mac ie browsers a height, which is *treated* as min-height since ie expands it anyway */ /* hide from ie mac \*/ * html .class-name {height: 10em;}/* end hide */ according to what i know, this will also work fine in ie7 since that browser will no longer see the * html styling rules. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Newbie with CSS layout
Reynier, On Apr 5, 2006, at 11:40 AM, Reynier Perez Mira wrote: Hola a todos: I found some CSS layout in this site: http://blog.html.it/ layoutgala/. Now I have my CSS layout but this have many problems. The sample is at this adress: http://www.valencia.ch/simpro/sample4.html http://www.valencia.ch/simpro/css/simpro_ga4.css http://www.valencia.ch/simpro/css/simpro_ie4.css As you can see this layout have a lot of problems and I need fix with your help. The table version is here: http://valencia.ch/simpro/sample_v3.html http://valencia.ch/simpro/css/simpro_ga3.css http://valencia.ch/simpro/css/simpro_ie3.css This is how the layout be at end. I'm playing a little with CSS to make possible positioning the right lateral menu, beside principal header. The HTML is this: div id=header div id=header_img_topnbsp;/div div id=header_img_downnbsp;/div div id=menu div id=menu_item_1¿Quiénes somos?/div div id=menu_item_2¿Qué hacemos?/div div id=menu_item_3Noticias/div div id=menu_item_4Foros de Discusión/div div id=menu_item_5Libro de Visitas/div div id=menu_item_6Galería de Imágenes/div /div /div Change the html to div id=header ul id=menu li id=item_1¬øQui√©nes somos?/li li id=item_2¬øQu√© hacemos?/li li id=item_3Noticias/li li id=item_4Foros de Discusi√≥n/li li id=item_5Libro de Visitas/li li id=item_6Galer√≠a de Im√°genes/li /ul div id=header_img_topnbsp;/div div id=header_img_downnbsp;/div /div css --- #menu { float: right; width: 194px; list-style-type: none; } #menu li { line-height: 31px } It would work better if you combined all the parts of the header images into one and assigned it to #header. Note: All this changes only take effect in FF but in IE everything goes wrong, then when I finished with FF I start with IE or this is a bad way to think. That is a good way to think. I'll check back after work. Roger, -- Roger Roelofs [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Targeting DIV question
On 4/5/06, Steve Rachels [EMAIL PROTECTED] wrote: I know there must be a way, but being new to css, I don't have the slightest clue as to how to make a graphic come up in a given layer (div?) when a button is pressed.. Example of what I'm after: http://sketchbookgraphics.com/layoutQuestion.html If anyone knows of a tutorial on this, please let me know. i think if you're looking for a button click event, that's javascript or a server-side language. if you're looking for hover effects instead, that's css, you're in the right place, and this page has a cool example: http://www.tjkdesign.com/articles/css%20pop%20ups/5.asp __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] auto height
Hi. I've got a page that's set up with a tiled body background, a margin-auto div to center the content horizontally, tan background block within the centered div, and a row of floated image thumbnails that's supposed to sit within all this. Except the tan background stops about halfway through the row of images, rather than extending to the end of the div. I've tried height:auto and height:100% on all of the divs without success. The only thing that seems to work is assigning a value to the height of the tan div. But I don't want to do that, because its height needs to vary depending on the content within it. Stylesheet is at www.teetsy.com/geoff.css. Code follows. Any thoughts? abridged code... body div class=container div class=navmenu ul id=navlist li id=tees menu items... /li /ul /div img src=logo alt=logo style=float:right;margin:-40px -30px 0 0/ div class=tan div class=content h1 style=text-align:left;margin-left:-30pxheadline/h1 a style=margin:10px 0px 10px 10px href=whateverimg style=border:0; width:462px; height:37px src=./images/freeshipping.gif title=That's right! I said it! alt=free shipping //a div class=floatthumb img class=t_thumb src=image alt=image / a href=blah blahblah blah blahcaption info/abr / caption info /div div class=floatthumb another floated image and caption /div /div !--content-- /div!--tan-- /div!--container-- /body __ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] margins problem
Gunlaug Sørtun wrote: Enrico Teotti wrote: Hi, I'm experiencing a margin problem on this page: http://esion.textdriven.com/gardakom there are other things to set up but right now I'm bothered about the margin you see between the top-content center-content and bottom-content. The margins are setted to zero... but only if I set up a border (to all the three divs) the margins disappear. I've googled but I didn't found an answer. Looks like standardized 'Collapsing margins'... http://www.w3.org/TR/CSS21/box.html#collapsing-margins ...and IE/win gets it wrong - as usual. For more resources on collapsing margins, see our wiki page: http://css-discuss.incutio.com/?page=CollapsingMargin Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] newbie CSS on Firefox problem
Greetings from a CSS newbie; I apologize in advance for violating the prohibition on posting code but 1) I have no where to put this yet, and 2) it's so trivial I'm hoping you'll allow it. Here's my problem. I cannot get even a trivial piece of CSS working on Firefox. It works as expected on IE6. It's driving me NUTS!!! I would really appreciate it if someone could point me in the right direction. I've been searching the documentation, trying mods to everything I could think of, etc. and haven't gotten anywhere. I'm working in Ruby on Rails on Win2K. Here's my View code. html head titleCSS Demo/title %= stylesheet_link_tag 'listdemo', :media = 'all' % /head body h3Three line list/h3 div class = Listline1 First line will be one color /div div class = Listline0 Second line will be different color /div div class = Listline1 Third line will be the same color as the first /div /body /html Here's the Controller: class ListdemoController ApplicationController def index end end Here's the stylesheet: .Listline0 { background: ff; } .Listline1 { background: ff; } I've gotta believe that I'm just missing some small but key piece of information. I would really appreciate any help you could provide. Thanks in advance, Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] auto height
Geoff Dougherty wrote: Hi. I've got a page that's set up with a tiled body background, a margin-auto div to center the content horizontally, tan background block within the centered div, and a row of floated image thumbnails that's supposed to sit within all this. Except the tan background stops about halfway through the row of images, rather than extending to the end of the div. I've tried height:auto and height:100% on all of the divs without success. The only thing that seems to work is assigning a value to the height of the tan div. But I don't want to do that, because its height needs to vary depending on the content within it. Stylesheet is at www.teetsy.com/geoff.css. Code follows. Any thoughts? Hi Geoff, It sounds like you need some float containment (this is a guess because I'm too busy to recreate your page out of the code you provided -- could you link to the live page please?): http://css-discuss.incutio.com/?page=ClearingSpace Best, Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
Bill wrote: Greetings from a CSS newbie; I apologize in advance for violating the prohibition on posting code but 1) I have no where to put this yet, and 2) it's so trivial I'm hoping you'll allow it. Here's my problem. I cannot get even a trivial piece of CSS working on Firefox. It works as expected on IE6. [SNIP] Here's the stylesheet: .Listline0 { background: ff; } .Listline1 { background: ff; } Thanks in advance, Bill Bill- try specifying the colors like so: background-color: #ff; You can also shorten that to: #fff; and #fcc; (think of each character/number as part of a pair, broken down like ff cc cc). Regards, Ron __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
Hi Ron, Thank you very very much. That was driving me crazy. The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? I'd sure like to avoid this in the future, if possible. Thanks again for your help. I really appreciate it. Best regards, Bill - Original Message - From: Pringle, Ron [EMAIL PROTECTED] To: Bill Walton [EMAIL PROTECTED]; css-d@lists.css-discuss.org Sent: 2006-04-05 2:52 PM Subject: RE: [css-d] newbie CSS on Firefox problem Bill wrote: Greetings from a CSS newbie; I apologize in advance for violating the prohibition on posting code but 1) I have no where to put this yet, and 2) it's so trivial I'm hoping you'll allow it. Here's my problem. I cannot get even a trivial piece of CSS working on Firefox. It works as expected on IE6. [SNIP] Here's the stylesheet: .Listline0 { background: ff; } .Listline1 { background: ff; } Thanks in advance, Bill Bill- try specifying the colors like so: background-color: #ff; You can also shorten that to: #fff; and #fcc; (think of each character/number as part of a pair, broken down like ff cc cc). Regards, Ron __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] File input question
I recently added a file input element to a test page and wanted to resize the width of the textbox. In IE this works easily, but Firefox doesn't seem to allow any styling at all. Is this a known issue or am I missing something? Any help would be appreciated. Thanks, Jonathan __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
On 4/5/06, Bill Walton [EMAIL PROTECTED] wrote: Hi Ron, Thank you very very much. That was driving me crazy. The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? I'd sure like to avoid this in the future, if possible. you're in luck! they don't require a url. :) - 2nd or 3rd option box on each page: http://validator.w3.org/ http://jigsaw.w3.org/css-validator/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
Bill Walton wrote: [...] The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? [...] Hi Bill, The w3c css-validator has also the possibility to upload a stylesheet http://jigsaw.w3.org/css-validator/validator-upload.html, or, in a text-box, to upload partial css-text http://jigsaw.w3.org/css-validator/validator-text.html. And: a validate local css option (leading to the same w3c validator) is built in in Chris Pederick's WebDeveloper-extension, in Firefox a must-have tool http://chrispederick.com/work/webdeveloper/! Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
On Wednesday 2006-04-05 15:15 -0500, Bill Walton wrote: Thank you very very much. That was driving me crazy. The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? I'd sure like to avoid this in the future, if possible. In addition to the file-upload mechanisms for the CSS validator that were already pointed out, I'd like to mention that Firefox 1.5+ displays CSS parsing errors on the Javascript Console (Tools - Javascript Console). -David -- L. David BaronURL: http://dbaron.org/ Technical Lead, Layout CSS, Mozilla Corporation pgphscHqyH0Gv.pgp Description: PGP signature __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Centered Content with fixed background
Greetings. I'm attempting a css layout with as few images as possible, etc. I'm attempting something similar to the Complex Spiral to simulate a semi-transparent background color on top of a full colored photo with the exception of not having the layout anchored to a corner - the main content centers horizontally on a page. I know you can achieve the desired effect with a screened image on top of the full colored image, using two fixed background images, but can it be done for horizontally-centered content? A monkey wrench: I had it working applying the faux screened image to the ul. Unfortunately, I need to space out these menu list items so a few pixels of the full colored image shows through between each menu item. TIA, Shawn Tritz Design Engineer __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Scrolling divs and named anchors
Hi, I have a page with a scrolling div is containing information on technical terms from A through to Z and using named anchors for navigation of the technical terms, only the problem I seem to have is when I click on a link it takes you to the right place in the scroll div but the whole page jumps to the bottom and the links are not visible anymore, is there a way to fix this? Thank you Martyn. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is IE 6.0 reading well my CSS or I am mistaken?... :)
Michel Bozgounov wrote: OK, here's the link: http://lelion.info/web/cantarco/ [...] In IE at the right, all is wrong [...] FF, Opera are OK (on Windows). Hi Michel, George gave already some good advices to get IE playing the game. I've something about FF... In my FF1.07 under Windows98SE the images wrapper-left.gif and wrapper-right.gif don't show as borders left and right of the middle part. Resizing window or other resolutions don't help: never shown. See screenshot http://home.tiscali.nl/developerscorner/css-discuss/images/cantaro-ff1.gif. It seems adding a transparent border to the #wrapper-inner will solve this. See screenshot2 http://home.tiscali.nl/developerscorner/css-discuss/images/cantaro-ff2.gif. (perhaps the IE-hacks for other things then need to be finetuned somewhat; I didn't test in IE). - Mozilla 1.71 and old NN6.2 don't show the side-img's either: seems to be so for the whole Gecko-family under Win98SE.. - Opera 7.54 and Opera8.01 are o.k. under Win98SE. Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE6 Ignoring text-decoration
I have some links inside of a table. Two TD cells in this table have their own css class. When: .cellOne { text-decoration: none; } .cellTwo { text-decoration: none; } IE6 ignores the text-decoration css for cellTwo. There's not a single other difference between these two cells, and even if I try apply style=text-decoration: none; to the a href element itself, IE ignores it. However, any other css in cellTwo is observed - so IE isn't ignoring the class, it's ignoring the text-decoration. There is no other definition of the cellTwo class, so nothing is overriding it. cellOne works fine. The only other place the text-decoration is defined is the general css for all links, but it doesn't affect cellOne at all. Any ideas? IE7 works fine. Michael Botsko Web Developer 503.227.2571 x230 AIM: botskonet TechTracker, Inc www.techtracker.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Scrolling divs and named anchors
is there a way to fix this? I'm 99% certain that it's a no =( __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
I have no idea what I was looking at / how I missed the W3C validation options you've pointed out. To think I spent the better part of a day banging my head on this ;-p It's clear I've got a lot to learn ;-) Thanks to you all for your help! Best regards, Bill - Original Message - From: francky [EMAIL PROTECTED] To: Bill Walton [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org Sent: 2006-04-05 4:00 PM Subject: Re: [css-d] newbie CSS on Firefox problem Bill Walton wrote: [...] The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? [...] Hi Bill, The w3c css-validator has also the possibility to upload a stylesheet http://jigsaw.w3.org/css-validator/validator-upload.html, or, in a text-box, to upload partial css-text http://jigsaw.w3.org/css-validator/validator-text.html. And: a validate local css option (leading to the same w3c validator) is built in in Chris Pederick's WebDeveloper-extension, in Firefox a must-have tool http://chrispederick.com/work/webdeveloper/! Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
Sorry to bother you guys again, but I pasted the stylesheet in the W3C css-validator and got the results below, which I totally do not understand. I mean, I'm getting the visual result I expected, and the stuff below is only warnings, but the words make no sense to me and my gut tells me it's just a matter of time before this bites me. I know it's just newbie ignorance, but that's not a state I tolerate well for long. What's the best way for a motivated guy to move forward to a more learned state here? Any / all suggestions are much appreciated. Thanks again, Bill Warnings URI : file://localhost/TextArea a.. Line : 2 (Level : 1) You have no color with your background-color : .Listline0 b.. Line : 7 (Level : 1) You have no color with your background-color : .Listline1 Valid CSS information a.. .Listline0 { a.. background-color : #fff; } b.. .Listline1 { a.. background-color : #fcc; } - Original Message - From: cj [EMAIL PROTECTED] To: Bill Walton [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org Sent: 2006-04-05 3:36 PM Subject: Re: [css-d] newbie CSS on Firefox problem On 4/5/06, Bill Walton [EMAIL PROTECTED] wrote: Hi Ron, Thank you very very much. That was driving me crazy. The W3C CSS validator requires a URL. Is there one for the desktop you'd recommend? I'd sure like to avoid this in the future, if possible. you're in luck! they don't require a url. :) - 2nd or 3rd option box on each page: http://validator.w3.org/ http://jigsaw.w3.org/css-validator/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
On 4/5/06, Bill Walton [EMAIL PROTECTED] wrote: Sorry to bother you guys again, but I pasted the stylesheet in the W3C css-validator and got the results below, which I totally do not understand. a.. Line : 2 (Level : 1) You have no color with your background-color : This is a warning, not an error, and is intended to call attention to the possibility that an inherited colour might be the same as the background colour you've used, and so make any text in the element invisible. You can ignore it or do what I tend to do, which is to insert a color: inherit; to explicitly tell the validator that I indend the text-color to be inheritited. That makes my css file slightly larger, of course. But warnings are just warnings... -- Ed Seedhouse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] newbie CSS on Firefox problem
Since you specified text colors, it's just suggesting that you specify background colors too, just incase the user sets their default background color to the same as your specified text color, etc. CSS validator warnings usually aren't big deals, but be sure there aren't any errors. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE6 Ignoring text-decoration
Mike Botsko wrote: I have some links inside of a table. Two TD cells in this table have their own css class. When: .cellOne { text-decoration: none; } .cellTwo { text-decoration: none; } IE6 ignores the text-decoration css for cellTwo. There's not a single other difference between these two cells, and even if I try apply style=text-decoration: none; to the a href element itself, IE ignores it. However, any other css in cellTwo is observed - so IE isn't ignoring the class, it's ignoring the text-decoration. There is no other definition of the cellTwo class, so nothing is overriding it. cellOne works fine. The only other place the text-decoration is defined is the general css for all links, but it doesn't affect cellOne at all. Any ideas? IE7 works fine. Hi Mike, Strange - strange- strange! I built your table, but cannot reproduce the problem. See testpage http://home.tiscali.nl/developerscorner/css-discuss/test-textdecoration-IE.htm. With IE6 under Win98SE everything is doing fine, as in FF. Browsershots.com says: because of a flash AddOn (nothing flashy to see in my html!) ... IE6 under XP is crashing http://home.tiscali.nl/developerscorner/css-discuss/images/test-underline-IE6-onXP.png but seems o.k. for the underlines, IE7beta under XP is ok http://home.tiscali.nl/developerscorner/css-discuss/images/test-underline-IE7b-onXP.png, Safari is o.k. http://home.tiscali.nl/developerscorner/css-discuss/images/test-underline-Safari.png So my conclusion for now is: or something in XP, or a typo, or something complicating/interfering in the rest of the css or html code? Do you have a link to a page which shows your phenonenon? Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dynamic menus and z-index? (formerly More SOS) (Ingo Chao)
Ingo Chao wrote: [EMAIL PROTECTED] wrote: http://spppa.littleberrystudio.com For FirefoxCo, #nav li ul {z-index:1} should solve the problem of text+borders peeking through in flyouts of preceding elements. Since the problem is that the position:relative is establishing a new stacking context, which will paint over preceding ones: - #nav li { position:relative;} you could try to set this to position:static. Set it to position:relative only on hover/over. Haven't tried it, though. Maybe if my site should ever need a three-leveled flyout menu with negative indent. Ingo O.. You're good! Thank you very much. That fixed it beautifully, both the z-index and the position:static with position:relative on hover. I haven't had a chance to read through the posts in a bit but I'm so glad I finally did. Perhaps I designed myself into a corner to use such deep flyouts, but it was the best compromise to the issues at hand (and the client picked this design). I'm trying to make them as painless as possible. :) Thanks to everyone who offered help! Thanks to Ingo for such an elegant solution! -Patricia http://www.littleberrystudio.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Content with fixed background
Hello, Shawn, You wrote: Greetings. I'm attempting a css layout with as few images as possible, etc. I'm attempting something similar to the Complex Spiral to simulate a semi-transparent background color on top of a full colored photo with the exception of not having the layout anchored to a corner - the main content centers horizontally on a page. This sounds ambitious. Please do let us see the results when you get it working. A monkey wrench: I had it working applying the faux screened image to the ul. Unfortunately, I need to space out these menu list items so a few pixels of the full colored image shows through between each menu item. Try spacing the list items with borders instead of margins, perhaps? Cordially, David -- David Hucklesby, on 4/5/2006 http://www.hucklesby.com/ -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE 6 fieldset Issues
Seems like IE doesn't think a fieldset is a block object. Adding display: block; to the fieldset will fix the problem and doesn't cause any adverse affects to Firefox or Safari. Score another point for open-source software. -Tyson On Apr 4, 2006, at 6:11 PM, Tyson Tate wrote: IE 6 seems to have an issue with fieldsets that have margins. If there's a block element next to the fieldset, it appears to work. But if two fieldsets are right next to each other in the code, they get shifted to the right. http://ohgoditburns.net/forms.html Works fine in Safari and Firefox, but IE 6 chokes. Any ideas? Thanks, Tyson __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/