[css-d] IE issues: positioning and background problems
Hello, I actually asked for assistance with first problem before and thought the problem was fixed but it is not. I have two problems with IE: 1. Cockerel at the bottom does not get the correct z-index -- should be in front of the #footer on the home page http://designbyelle.com.au/mq/ 2. I'm using a background image on #timeline, which does not appear in IE The page is at: http://designbyelle.com.au/mq/sailing-through-time.html I just can't think of why this is happening in IE Thanks, Elle __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with max-width, right aligned div and remaining height design
Olivier Sannier wrote: Gunlaug Sørtun wrote: Olivier Sannier wrote: http://photos2.obones.com/photo.php?NoPhoto=483 http://photos2.obones.com/photo.php?NoPhoto=484 Maybe this got unnoticed, but I would really appreciate any help with these problems. In essence: make the basics work without trying to hack the living daylight out of browsers - remove all hack-attempts, so we can look at how to add the features you ask for help with without having to rebuild the entire stylesheet from scratch. Thanks for your answer. I have updated the site and commented out the hacks in the stylesheet, but it does not look like what I would like it to look like. Below are the problems I'm having. 1. The header buttons are displayed on top of each other while I want them to be displayed one next to the other. I have tried using display: inline but this prevents me from using width. Basically, I want the following display: - header takes the entire width of the window - header_lang is 60pixels wide - header_buttons takes all remaining space on the same line as header_lang - header_button takes 25% width of its containing header_buttons div. As there are four buttons, this makes them use all the width of the parent. An example of what I would like can be seen on the production site at this address: http://photos.obones.com/ This is using tables to do the formatting, so I'm trying to get rid of them as suggested here. 2. The vertical scrollbar is showing for the entire page. I want it to show only for the vbox div which is placed in the hbox div. This last one has a gray background which makes it easier to distinguish from the header. The hacks that I commented out were used to obtain the desired effect, but I would gladly accept a more standard way of achieving this. The production site mentioned at point 1 above uses frames to get this, but frames are no longer to be used, so I'm trying to redesign the site. Thank you all for your help. Regards Olivier I had some troubles with the list, so maybe my answer was not seen properly, or by everyone, so I'm answering myself here in the hope someone will have clues as to my problems above. Thanks in advance Olivier __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE issues: positioning and background problems
Elle Meredith wrote: 1. Cockerel at the bottom does not get the correct z-index -- should be in front of the #footer on the home page http://designbyelle.com.au/mq/ The test-file I sent you corrections for IE from before... http://www.gunlaug.no/tos/alien/em/test_09_0111.html ...with stylesheets so you can sort out what went missing... http://www.gunlaug.no/tos/alien/em/test_09_0111_files/layout00.css http://www.gunlaug.no/tos/alien/em/test_09_0111_files/master00.css http://www.gunlaug.no/tos/alien/em/test_09_0111_files/reset000.css http://www.gunlaug.no/tos/alien/em/test_09_0111_files/screen00.css 2. I'm using a background image on #timeline, which does not appear in IE The page is at: http://designbyelle.com.au/mq/sailing-through-time.html Add a 'hasLayout' trigger for IE to #timeline... #timeline { height: 1%;} regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
On Thursday 29 January 2009 9:31:54 pm you wrote: David McGlone wrote: I'm thinking that even though there are more than 1 words, closing the tag after each word does not make it a whole new box that can be moved individually. Am I thinking correctly? No, I'm afraid your thinking is flawed for positioning bits of text on top of a fixed background (image). For the left column only: if you want to use a fixed background for your text - links or whatever, this is the most steady method... http://www.gunlaug.no/tos/alien/dmg/test_09_0130.html http://www.gunlaug.no/tos/alien/dmg/test_09_0130_files/styles00.css ...where individual paragraphs are absolute positioned. Those paragraphs will adjust vertically for font resizing, but long lines will overflow horizontally pretty quickly. If you want links instead, just replace the ps with as. Sidenote: The entire http://www.dmcentral.net/eweb/ shows that you're relying on what you see for browser-defaults at your end - your layout has no flexibility. Not a good idea since that means your layout is doomed to fail... http://www.gunlaug.no/contents/wd_additions_37.html ...and I do not think you want that :-) You're correct. I make changes and look at it with firefox. I'm aware it probably will not look the same in different versions of IE, Opera, etc, but I haven't figured out what to do to fix this. What would you recommend? You're also declaring a number of properties/values back to their default-values. Although there's no harm in doing so, you get a lot of unnecessary declarations in there. All those other declarations on the page are just junk. I started experimenting with an old CSS file from 2003. It's been years, but that is what happens when one has kids. LOL -- David M. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] a png not displaying!
Odd one here. http://www.dbadvertising.co.uk/dev/index-test.php All the pngs display in IE6 fine with exception of the address logo. Style sheet is at /dev/includes/ie-fix.css and /style-new.css. I cannot for the life of me see where the error lies. You guys any thoughts? Ian Young Director IY e-Solutions This e-mail contains information which is confidential and may also be privileged. It is for the exclusive use of the intended recipient(s). If you are not the intended recipient(s) please note that any form of, distribution, copying or use of this e-mail or the information in it is strictly prohibited and may be unlawful. If you have received this in error please inform us at the above address then delete the e-mail and destroy any copies of it. Thank you. IY e-Solutions is a trading name of IYES Ltd. Registration: SC208707 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
David McGlone wrote: You're correct. I make changes and look at it with firefox. I'm aware it probably will not look the same in different versions of IE, Opera, etc, but I haven't figured out what to do to fix this. What would you recommend? Apart from with IE6-7-8, don't mind browser _versions_ too much. There are too many... Unless you experiment heavily with CSS3 and/or proprietary CSS, the latest versions of Firefox, Opera, Safari etc. will pretty much handle all reasonably well thought-out and standards compliant layouts/designs the same. The major browsers are available on win-XP and up for testing, and if you run on another OS you still can get hold of most. Always good to see for yourself what's going on. What you _should_ do is to stress-test your layouts and final designs/pages a bit in Firefox - since that's your preference. At least 200% font resizing (not page zooming) usually reveals most weaknesses in a layout/design/finished page, and is a good starting-point for checking design quality and basic accessibility - see: WCAG2 standard. All those other declarations on the page are just junk. I started experimenting with an old CSS file from 2003. It's been years, but that is what happens when one has kids. LOL Maybe better to start with a clean sheet then, and catch up on CSS 2.1 now that you have a chance :-) Tip: avoid absolute positioning for major elements (containers) in a page, and don't fix vertical dimensions on them. regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a png not displaying!
Yep found it... in the ie-fix.css you've linked to: src='../images/Adress-top-3.png' Yet the image is /images/Address-top-2b.png Make that change and it should be sorted :) ~Mx http://www.mxdx.co.uk 2009/1/30 Ian Young i...@iyesolutions.co.uk: Odd one here. http://www.dbadvertising.co.uk/dev/index-test.php All the pngs display in IE6 fine with exception of the address logo. Style sheet is at /dev/includes/ie-fix.css and /style-new.css. I cannot for the life of me see where the error lies. You guys any thoughts? Ian Young Director IY e-Solutions This e-mail contains information which is confidential and may also be privileged. It is for the exclusive use of the intended recipient(s). If you are not the intended recipient(s) please note that any form of, distribution, copying or use of this e-mail or the information in it is strictly prohibited and may be unlawful. If you have received this in error please inform us at the above address then delete the e-mail and destroy any copies of it. Thank you. IY e-Solutions is a trading name of IYES Ltd. Registration: SC208707 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a png not displaying!
Nah Sorry that doesn't make any difference. The script is designed to replace what is in the html. I don't think the problem is in the ie-fix, because if I strip everything out and just use the .flash_home div it works ok. However, if you look at page now, I have made the changes to save any confusion. Best regards Ian This e-mail contains information which is confidential and may also be privileged. It is for the exclusive use of the intended recipient(s). If you are not the intended recipient(s) please note that any form of, distribution, copying or use of this e-mail or the information in it is strictly prohibited and may be unlawful. If you have received this in error please inform us at the above address then delete the e-mail and destroy any copies of it. Thank you. -Original Message- From: Martyn Merrett [mailto:mx.css...@googlemail.com] Sent: 30 January 2009 15:23 To: Ian Young; css-d@lists.css-discuss.org Subject: Re: [css-d] a png not displaying! Yep found it... in the ie-fix.css you've linked to: src='../images/Adress-top-3.png' Yet the image is /images/Address-top-2b.png Make that change and it should be sorted :) ~Mx http://www.mxdx.co.uk 2009/1/30 Ian Young i...@iyesolutions.co.uk: Odd one here. http://www.dbadvertising.co.uk/dev/index-test.php All the pngs display in IE6 fine with exception of the address logo. Style sheet is at /dev/includes/ie-fix.css and /style-new.css. I cannot for the life of me see where the error lies. You guys any thoughts? Ian Young Director IY e-Solutions This e-mail contains information which is confidential and may also be privileged. It is for the exclusive use of the intended recipient(s). If you are not the intended recipient(s) please note that any form of, distribution, copying or use of this e-mail or the information in it is strictly prohibited and may be unlawful. If you have received this in error please inform us at the above address then delete the e-mail and destroy any copies of it. Thank you. IY e-Solutions is a trading name of IYES Ltd. Registration: SC208707 __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] horizontal menu wrapping in IE6
Hello All, I have a horizontal menu that is wrapping in IE6. It consists of a ul with background images. Here is the page: http://frank.mtsu.edu/~mtabroad/sa_students/about_test.shtml Here are the styles: #header ul { margin: 0; padding: 0; width: 784px; height: 70px; _height: 71px; border-bottom: 1px solid #ccc; list-style: none; float: left; margin: 10px 0 0 0; } #header ul li { float: left; width: 98px; margin: 0; } a.welcome, a.about, a.calendar, a.programs, a.apply, a.funding, a.pdorient, a.reorient { display: block; float: left; text-decoration: none; font: bold #00 11px Arial, Helvetica, sans-serif; width: 88px; _width: 98px; padding: 43px 5px 0 5px; text-align: center; } Can anyone help me fix this? Thanks, Kris __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] horizontal menu wrapping in IE6
A.K. Allen wrote: I have a horizontal menu that is wrapping in IE6. http://frank.mtsu.edu/~mtabroad/sa_students/about_test.shtml Add... * html #header ul li {overflow-x: hidden;} ...to prevent the anchors from expanding the list-items in IE6. BTW: IE6 is in standards mode, so hacking width to include side-paddings on anchors in it is a bit misplaced. Side-paddings are added to width in that mode. regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a png not displaying!
Ian Young wrote: Nah Sorry that doesn't make any difference. The script is designed to replace what is in the html. I don't think the problem is in the ie-fix, because if I strip everything out and just use the .flash_home div it works ok. From the head... !--[if gte IE 5.5] ![if lt IE 7] link rel=stylesheet href=./includes/ie-fix.css type=text/css / ![endif] ![endif]-- I don't use conditional comments very much, but I'm not so sure you can nest them like this... Have you tried using only the lt IE7 and taking away the gte 5.5 wrapper? - JCD __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Issue with third column in Faux Columns layout
Greetings: My website that is presently live (www.emspacedesign.com), is working perfectly in Firefox on the Mac, but it's showing white gaps at the bottom of the second or third column in all of the other browsers. So I decided to use the Faux Columns layout technique to solve the problem. I'm very close to making it work, but I'm having this one issue: I can't seem to get the subnavigation (bio / testimonials / mission / what's an emspace) in the third column to line up correctly. It needs to be directly under the about. Here's the location of my test file: http://www.emspacedesign.com/bio2.html I tried switching the order of the divs, and that put it in the right place, but then it pushed down the second column and left a big white gap in the that column. What am I doing wrong? Thanks, Emily __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] getting lists to align right in ie7
hey all, there is a problem I hope you can help with - I am pretty much at the end of my rope. I have a page where I would like some things to line up on the right, and it's working in the browsers I've tested except for IE6 and 7. I've got it more or less looking right in 7, if you don't look too closely. To get the two lists in the menu to align right, I have an ie7 specific style which reads .menu ul li { float : right; } now - this is good except that the links are now in the opposite order than I want them. http://www.caut.ca/ugfa/test/test3.html http://www.caut.ca/ugfa/test/js_css/test3.css http://www.caut.ca/ugfa/test/js_css/ie7-hacks3.css http://www.caut.ca/ugfa/test/js_css/ie6-hacks3.css thanks in advance. Sandy __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Two Column Dropdown Menu
Hello, Our content has greatly expanded and we're getting to the point where we are running out of space with our drop downs. I have been on the White Houses new website quite a bit lately trying to figure out how to something similar. I was wondering if anyone had a link to a write up on two column css drop downs as everything I have found in Google usually deals with the overall layout. I don't need it to be as complex as the White Houses, I just need something to go off as a start. http://whitehouse.gov Thanks, Michael __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] gettings lists to align right
hey all, there is a problem I hope you can help with - I am pretty much at the end of my rope. I have a page where I would like some things to line up on the right, and it's working in the browsers I've tested except for IE6 and 7. I've got it more or less looking right in 7, if you don't look too closely. To get the two lists in the menu to align right, I have an ie7 specific style which reads .menu ul li { float : right; } now - this is good except that the links are now in the opposite order than I want them. http://www.caut.ca/ugfa/test/test3.html http://www.caut.ca/ugfa/test/js_css/test3.css http://www.caut.ca/ugfa/test/js_css/ie7-hacks3.css http://www.caut.ca/ugfa/test/js_css/ie6-hacks3.css thanks in advance. (also apologies if I've sent this twice - a little email trouble) Sandy __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] stacking obscuring links in IE6
I'm having what I think is a stacking issue in IE6 - the menu links on the left are not clickable, except for 'Contact.' But I can't see the problem - can someone help? Greatly appreciated. http://www.vicschendel.com/portfolio.php -- Debbie www.redkitecreative.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Issue with third column in Faux Columns layout
Emily Songster wrote: Greetings: My website that is presently live (www.emspacedesign.com), is working perfectly in Firefox on the Mac Is it? Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.4; en-US; rv:1.9.0.5) Gecko/2008120121 Firefox/3.0.5 Gap bottom right column: http://www.emspacedesign.com/print.html http://www.emspacedesign.com/contact.html http://www.emspacedesign.com/web.html http://www.emspacedesign.com/identity.html http://www.emspacedesign.com/exhibit.html http://www.emspacedesign.com/packaging.html Emily Welcome to the World Wide Web. The Web is different than print :-) . -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Two Column Dropdown Menu
Michael Halvorsen wrote: Hello, Our content has greatly expanded and we're getting to the point where we are running out of space with our drop downs. Then you may need a site map ;-) ? Thanks, Michael -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] stacking obscuring links in IE6
Debbie Campbell wrote: I'm having what I think is a stacking issue in IE6 - the menu links on the left are not clickable, except for 'Contact.' But I can't see the problem - can someone help? Greatly appreciated. http://www.vicschendel.com/portfolio.php Does adding width trigger hasLayout [1] on your end in IE/6 ? #navlist li a, #navlist li a:link, #navlist li a:visited {width: 160px;} [1] http://www.satzansatz.de/cssd/onhavinglayout.html -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
On Friday 30 January 2009 9:01:39 am Gunlaug Sørtun wrote: David McGlone wrote: You're correct. I make changes and look at it with firefox. I'm aware it probably will not look the same in different versions of IE, Opera, etc, but I haven't figured out what to do to fix this. What would you recommend? Apart from with IE6-7-8, don't mind browser _versions_ too much. There are too many... Unless you experiment heavily with CSS3 and/or proprietary CSS, the latest versions of Firefox, Opera, Safari etc. will pretty much handle all reasonably well thought-out and standards compliant layouts/designs the same. The major browsers are available on win-XP and up for testing, and if you run on another OS you still can get hold of most. Always good to see for yourself what's going on. What you _should_ do is to stress-test your layouts and final designs/pages a bit in Firefox - since that's your preference. At least 200% font resizing (not page zooming) usually reveals most weaknesses in a layout/design/finished page, and is a good starting-point for checking design quality and basic accessibility - see: WCAG2 standard. All those other declarations on the page are just junk. I started experimenting with an old CSS file from 2003. It's been years, but that is what happens when one has kids. LOL Maybe better to start with a clean sheet then, and catch up on CSS 2.1 now that you have a chance :-) Tip: avoid absolute positioning for major elements (containers) in a page, and don't fix vertical dimensions on them. Thanks Georg, You've been a great help! Your responses have also helped me keep my confidence. -- David M. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
David McGlone wrote: I've been doing a lot of CSS coding lately and I'm having a slight problem with text positioning. I cannot seem to position any of the words after the first word. RE: http://www.dmcentral.net/eweb/ Georg Sortun has answered your question. Taking it a step further, making it happen, takes grace, dignity, and above all else, a fast car.[1] http://www.chelseacreekstudio.com/ca/cssd/test-107.html Notes on file. Strict doctype. Primary content precedes navigation. May holds at twice user default. Ouick checked IE 6/7, Opera, Safari, Camino, Firefox. http://www.chelseacreekstudio.com/ca/cssd/test-107.html [1] http://www.youtube.com/watch?v=dl6yilkU1LI Tracy -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] width of scrollable table
Philippe Wittenbergh wrote: On Jan 29, 2009, at 7:10 AM, Jim Albert wrote: It seems like the only way I can get table to be clipped properly and scroll is to give a pixel length to the width of the DIV. I thought I could use: DIV style=width: 100%; overflow: auto; and I was expecting that the table would fill the width of the browser and then scroll horizontally when necessary. But what happens is the table expands out to the size needed to display all the images in the row of the table and in most cases causing the entire browser to gain a horizontal scroll bar. That is what should happen, and happens in a couple of browsers I happen to have open. Do you have a URL of a page showing the issue (in which browser) ? It is _always_ more easy to discuss things with sample code. I believe my problem is related to me placing the scrolling table within a table cell. I think I understand what some browsers are doing and perhaps there is a CSS solution that can be offered. Here are some simple examples: http://www6.netrition.com/scroll_table_by_itself.html This is a simple scrolling table that uses 100% width of the browser window and adjusts itself according to the size of the browser window. No problem; works fine in all browsers I've tried... Firefox, IE, Safari, Opera. http://www6.netrition.com/scroll_table_within_table.html Here I've placed that same scrolling table within a cell of an outer table. Notice that no scrolling appears. This behavior occurs in Firefox, IE and Safari. Only in Opera do I see the rendering that I would like. Opera sees that that middle cell of images is within a scrolling area and does not render the table with enough room for all the images. What I think is happening is that Firefox, IE and Safari are first determining table size based on the contents and determines it needs a lot of width to display all those images. It then assigns 100% of that very wide 2nd cell which is the table of images for scrolling. But since enough space was rendered to display all the images, no scrolling is necessary. I tried assigning widths to the 1st and 3rd outer cells. However, that has no affect, the table is still rendered large enough to display all the images at once. I don't want to assign widths, anyway. I like the rendering that Opera does. Is there some CSS I can apply that indicates to the browser not to render as much space as is necessary to display all the images within the 2nd cell? In other words... render the table and make use of the scrolling so that all three cells of the outer table are visible in the browser. Thank you. -- Jim Albert __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
On Friday 30 January 2009 9:26:46 pm David Laakso wrote: David McGlone wrote: I've been doing a lot of CSS coding lately and I'm having a slight problem with text positioning. I cannot seem to position any of the words after the first word. RE: http://www.dmcentral.net/eweb/ Georg Sortun has answered your question. Taking it a step further, making it happen, takes grace, dignity, and above all else, a fast car.[1] http://www.chelseacreekstudio.com/ca/cssd/test-107.html Notes on file. Strict doctype. Primary content precedes navigation. May holds at twice user default. Ouick checked IE 6/7, Opera, Safari, Camino, Firefox. http://www.chelseacreekstudio.com/ca/cssd/test-107.html [1] http://www.youtube.com/watch?v=dl6yilkU1LI Tracy Wow David, it looks great! can the source be downloaded? I'm actually excited to see how you did this. -- David M. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] width of scrollable table
On Jan 31, 2009, at 12:33 PM, Jim Albert wrote: http://www6.netrition.com/scroll_table_within_table.html Here I've placed that same scrolling table within a cell of an outer table. Notice that no scrolling appears. This behavior occurs in Firefox, IE and Safari. Only in Opera do I see the rendering that I would like. Opera sees that that middle cell of images is within a scrolling area and does not render the table with enough room for all the images. What I think is happening is that Firefox, IE and Safari are first determining table size based on the contents and determines it needs a lot of width to display all those images. It then assigns 100% of that very wide 2nd cell which is the table of images for scrolling. But since enough space was rendered to display all the images, no scrolling is necessary. That is the expected behaviour actually, given what css2.1 has to say on tables with 'table-layout:auto;' applied (the default behaviour). I tried assigning widths to the 1st and 3rd outer cells. However, that has no affect, the table is still rendered large enough to display all the images at once. I don't want to assign widths, anyway. If you insist on using a table for the outer layout, you'll have to assign a width to those two cells (you can set it to be a percentage width, though). Then, to insure control over that scrolling object, you have to set the (outer) table to table-layout:fixed and give it a width (e.g. 100%;). Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
On Friday 30 January 2009 9:26:46 pm David Laakso wrote: David McGlone wrote: I've been doing a lot of CSS coding lately and I'm having a slight problem with text positioning. I cannot seem to position any of the words after the first word. RE: http://www.dmcentral.net/eweb/ Georg Sortun has answered your question. Taking it a step further, making it happen, takes grace, dignity, and above all else, a fast car.[1] http://www.chelseacreekstudio.com/ca/cssd/test-107.html Notes on file. Strict doctype. Primary content precedes navigation. May holds at twice user default. Ouick checked IE 6/7, Opera, Safari, Camino, Firefox. http://www.chelseacreekstudio.com/ca/cssd/test-107.html [1] http://www.youtube.com/watch?v=dl6yilkU1LI Tracy never mind my last e-mail, I was so flabbergasted I forgot that I can look at the page source. -- David M. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Issue with third column in Faux Columns layout
Emily Songster wrote: Greetings: My website that is presently live (www.emspacedesign.com), is working perfectly in Firefox on the Mac, but it's showing white gaps at the bottom of the second or third column in all of the other browsers. So I decided to use the Faux Columns layout technique to solve the problem. I'm very close to making it work, but I'm having this one issue: I can't seem to get the subnavigation (bio / testimonials / mission / what's an emspace) in the third column to line up correctly. It needs to be directly under the about. Here's the location of my test file: http://www.emspacedesign.com/bio2.html Since the fonts are set so tiny (35.5% less than user default on the body) with a mix of em values throughout and a margin with a percent value and some elements with a height set, the survival of site's pages is dependent on your font-size preference, rather than what may be theirs... With regard to subnavigation question, what browsers are giving you difficulty? Seems okay, I think, in Mac OS X 10.4.11 Opera, Safari, and FF. And okay in XP IE 6/7 with the exception of this page [1] in IE/6 that experiences float drop of the right column. Aside: You may want to look into fixing the short page shift [2] [1] http://www.emspacedesign.com/print.html [2] http://www.communitymx.com/content/article.cfm?cid=528a0 Emily ~d -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Two Column Dropdown Menu
Michael Halvorsen wrote: Our content has greatly expanded and we're getting to the point where we are running out of space with our drop downs. Drop-downs easily run out of space and off screen, and size of available browser window is normally a big unknown. Anyway, you probably only need the basics, so this may get you started... http://www.gunlaug.no/tos/moa_41.html Source-code pretty much the same as the WH uses - without all unnecessary IDs, CLASSes and unnecessary elements. The method and CSS is very different though, and incomplete (lacking fixes for) for IE7 and lower. If you don't like my CSS - steal the WH's ones :-) regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] horizontal menu wrapping in IE6
A.K. Allen wrote: I have a horizontal menu that is wrapping in IE6. It consists of a ul with background images. Here is the page: http://frank.mtsu.edu/~mtabroad/sa_students/about_test.shtml Can anyone help me fix this? Thanks, Kris Can you be more specific because in a side by side comparison it looks the same in FF and IE/6.0. You may want to delete the height on the ul so it doesn't break when the mousetype is scaled-- assuming the faculty and brighter students know how to do that in the world's most popular browsers. Or are they all Firefox, Safari, Camino, SeaMonkey, or Opera converts at Middle Tennessee State University. ;-) . -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text positioning
David McGlone wrote: http://www.chelseacreekstudio.com/ca/cssd/test-107.html Tracy Wow David, it looks great! can the source be downloaded? I'm actually excited to see how you did this. David is out to lunch (most of the time). Do whatever you want with it or to it. But me myself I got nothing to prove -- Tracy Chapman -- A thin red line and a salmon-color ampersand forthcoming. http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/