[css-d] Problems with 3col snd 2 col layout in IE 6
Hi, This is my first post . Problem is : Both 3 cols layout on the home page and the 2 cols layout on the other pages are not rendering correctly in IE 6. The second column is not lining up with the first column (i.e. 'News' should be level with 'The Picture House') in IE 6 and the third column is just a lot lower than it should be in IE 6. I have checked the code and CSS and both are OK except for 1 or 2 minor problems. The pages render fine in FireFox. I have been trying to fix this problem for a while but everything I try does not work . If a member could explain to me where I have gone wrong and how to fix this problem I would be most grateful. URL is: http://www.deadred.co.uk/Documents/index.php (this is a test site) Many thanks, David David Roberts __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with 3col snd 2 col layout in IE 6
Sorry about that back online now. Cheers David On 4 Jan 2007, at 00:23, Sasha Gerrand wrote: > On 04/01/07, David Roberts <[EMAIL PROTECTED]> wrote: >> Problem is : Both 3 cols layout on the home page and the 2 cols >> layout on the other pages are not rendering correctly in IE 6. >> >> The second column is not lining up with the first column (i.e. 'News' >> should be level with 'The Picture House') in IE 6 and the third >> column is just a lot lower than it should be in IE 6. >> >> I have checked the code and CSS and both are OK except for 1 or 2 >> minor problems. >> >> The pages render fine in FireFox. >> >> I have been trying to fix this problem for a while but everything I >> try does not work . If a member could explain to me where I have gone >> wrong and how to fix this problem I would be most grateful. >> >> >> URL is: http://www.deadred.co.uk/Documents/index.php (this is a test >> site) > > FYI: The URI you provided says that 'This site is currently > offline'. ;) > -- > Cheers, > Sasha > === > This email has been verified as Virus free > Virus Protection and more available at http://www.plus.net > === __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] columns not correct in 3 col and 2 col layout using IE 6
Hi, URL is: http://www.deadred.co.uk/Documents/index.php The problem that I am having is that both the 3 column layout on the home page and the 2 column layout on the other pages are not rendering correctly in IE 6. The second column is not lining up with the first column (i.e. 'News' should be level with 'The Picture House') in IE 6 and the third column is just a lot lower than it should be in IE 6. I have checked the code and CSS and both are OK except for 1 or 2 minor problems. The pages renders fine in FireFox. I have tried to fix this problem for a while but with no luck . Any help would be greatful. Thanks David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] columns not correct in 3 col and 2 col layout using IE 6
Hi, I think that you will see more of the real problem if you go to one of the other sections, info, history. The "showing" column goes right up the into the header. thanks David David wrote: Hmmm, the first piece of text in the left column is marked up as , the first text in the right column is an . Maybe that makes the difference? David gnome at hawaii.rr.com authenticity, honesty, community David Roberts wrote: > URL is: http://www.deadred.co.uk/Documents/index.php > > The problem that I am having is that both the 3 column layout on the > home page and the 2 column > layout on the other pages are not rendering correctly in IE 6. > > The second column is not lining up with the first column (i.e. 'News' > should be level with 'The Picture House') in IE 6 and the third > column is just a lot lower than it should be in IE 6. -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] columns not correct in 3 col and 2 col layout using IE 6
Hi, Thanks very much for that info Wayne. I have tried what you said below, and on all the Mac browsers I have it works fine. Will have to wait until the morning to look at it on a PC with IE6. I wanted to know why you need to reposition the c2div so that it follows the c3div? Also there was one other small problem that I have with the two logos on the home page near the bottom of the page. The Weather Logo and the Pay Pal logo align fine in the Mac browses that I have tried accept Omni Web and Safari where the Weather logo is lower. Any idea why this is? Thanks again for your help, much appreciated. David On 16 Jan 2007, at 00:37, Wayne Babineau wrote: > Hi David > > I find that IE and FF treat your pages differently, having to do > with the > way they interpret positioning. If I delete the div#c2, your > unpositioned > (ie: normal flow) box rather than leaving it empty, then IE7 treats > the page > like FF. > > Suggestions: check the width of your c1/c4 divs: c4 is 100px wider, > which > results in c2 being placed below c4 but beside c1. > > Look at the margins you've set for c3: looks like these are to adjust > position to compensate for the overlapping error. > > Since you have c2 in the normal flow and are floating the left and > right > boxes, dimensions like width and margins become crucial. > > Removing the margins from c3 and deleting c2 places c3 correctly in my > browsers. > > Finally, and also importantly, repositioning the c2 div in your > source so > that it follows c3 has the result of positioning it correctly in my > browsers. > > HTH > Wayne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] columns not correct in 3 col and 2 col layout using IE 6
Hi Wayne, Thanks again for the information. David On 17 Jan 2007, at 22:39, Wayne Babineau wrote: > Hi David > >> -Original Message- >> >> Hi, >> >> Thanks very much for that info Wayne. I have tried what you >> said below, and on all the Mac browsers I have it works fine. >> Will have to wait until the morning to look at it on a PC with IE6. >> >> I wanted to know why you need to reposition the c2div so that >> it follows the c3div? >> >> >> Also there was one other small problem that I have with the >> two logos on the home page near the bottom of the page. >> >> The Weather Logo and the Pay Pal logo align fine in the Mac >> browses that I have tried accept Omni Web and Safari where >> the Weather logo is lower. >> >> Any idea why this is? >> >> Thanks again for your help, much appreciated. >> >> David >> > > You'll find more info on the w3 site at > http://www.w3.org/TR/REC-CSS2/visuren.html as well as many others > with which > I'm sure you're familiar. Simply, when you remove a box from the > normal flow > by floating it, it will be positioned vertically as it would within > the > normal flow, but shifted horizontally as far as possible within its > containing block's padding. > > By having c3 follow c2 in the normal flow and then floating it, you > have c3 > vertically following c2 but horizontally shifted right. Placing c2 > after c3 > in your source allows c3 to position vertically following c1 rather > than c2. > Since you now have two adjacent floats with plenty of horizontal > space in > the container (body), they align side by side. > > As to the Weather and PayPal logos, where on your page did you want > them to > appear? > > The simplest way to handle the logos would be to have them follow > c2 in your > source, no containing div unless you wanted some margins, and use a > > for vertical alignment or a series of non-breaking spaces ( ) for > horizontal spacing. With no position defined, the logos will appear > below > c2. Of course you could also place them within one of the main divs > on the > page. > > Wayne __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Navigation not showing in IE 6 and other problems
Hi all, The URL is: http://www.campbeltowngrammar.org.uk/cgs/index.php/ campbeltowngrammar/index/ I have just started building this site and would like to get the navigation working correctly before I go any further. There are a number of problems mostly with the navigation in IE6 - which is the only version I have looked at. 1 There are 3 different navigation sections in the header and in IE the two main ones are not showing up at all and the top links are 'dropping down' from there correct position. Works in Firefox. I have used 'float' and 'clear:both' in the CSS, but it has not helped. 2 In Safari the second nav bar is over to the left not the right were it should be. 3 I cannot get the second and third nav bar to align on the right had side so that 'Parents Resources' and 'School Board' are aligned. 4 In col 2 'Pupil Notice' and 'New Images' are not aligning in Firefox but are OK in safari. Thanks . David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Navigation not showing in IE 6 and other problems - added
Hi all, The URL is: http://www.campbeltowngrammar.org.uk/cgs/index.php/ campbeltowngrammar/index/ I forgot to add also that the 3 pictures on the home page, in IE, the last one goes below the other two for some reason. I have just started building this site and would like to get the navigation working correctly before I go any further. There are a number of problems mostly with the navigation in IE6 - which is the only version I have looked at. 1 There are 3 different navigation sections in the header and in IE the two main ones are not showing up at all and the top links are 'dropping down' from there correct position. Works in Firefox. I have used 'float' and 'clear:both' in the CSS, but it has not helped. 2 In Safari the second nav bar is over to the left not the right were it should be. 3 I cannot get the second and third nav bar to align on the right had side so that 'Parents Resources' and 'School Board' are aligned. 4 In col 2 'Pupil Notice' and 'New Images' are not aligning in Firefox but are OK in safari. Thanks . David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar help - Browser compatibility issues
Hi, I am having a few problems with the navigation that I have made and have been trying to fix the problem for a while now but no luck. There are 3 different navigation sections at the top. The first set are just text but for some reason in FF they don't work and in IE 6 they do. I think that it may have something to do with the search box but not sure what. The middle section is ok. The main navigation works ok but I cannot get it to position how I want it in Safari and IE. It drops below the blue background all the time. It is correct in FF. The URL is http://www.campbeltowngrammar.org.uk/ Thanks David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] 2-column layout problems and anchor links
Hi I have a problem with a 2 column layout which is working on some pages in IE but not others. It is dropping down below the first column. They are both floated col, one left one right. Should I be using: display:inline (hack) ? I am not having this problem with any other columns set up that I am using. Problem columns: link http://www.campbeltowngrammar.org.uk/main/art_depart Also I am having a problem with anchor links in IE. The links themselves are working ok it is the (return) to Top anchor that does not work. This is the code that I am using. Attendance Attendance Top link http://www.campbeltowngrammar.org.uk/?/main/a-z_a Thanks David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] 2-column layout problems and anchor links
Hi , David, that worked a treat, thanks. Now does anybody know how to fix inconsistent anchor links re below. They are working on some pages but not others in IE. Thanks, David >> Also I am having a problem with anchor links in IE. The links >> themselves are working ok it is the (return) to Top anchor that >> does not work. This is the code that I am using. >> >> Attendance >> >> Attendance >> >> Top >> >> link http://www.campbeltowngrammar.org.uk/?/main/a-z_a >> >> On 10 Mar 2007, at 01:12, ~davidLaakso wrote: > David Roberts wrote: >> I have a problem with a 2 column layout which is working on some >> pages in IE but not others. It is dropping down below the first >> column. They are both floated col, one left one right. Should I >> be using: display:inline (hack) ? I am not having this problem >> with any other columns set up that I am using. >> >> Problem columns: >> >> link http://www.campbeltowngrammar.org.uk/main/art_depart >> > For the above page, add a rule set to your CSS-- something like this: > #col4 ul { margin: 0; padding: 0; background-color: lime; float: > right; width: 220px;} > And validate the CSS file. > >> >> Also I am having a problem with anchor links in IE. The links >> themselves are working ok it is the (return) to Top anchor that >> does not work. This is the code that I am using. >> >> Attendance >> >> Attendance >> >> Top >> >> link http://www.campbeltowngrammar.org.uk/?/main/a-z_a >> > > > Validate the markup of the above page and see if that makes a > difference. > > >> >> >> David >> >> > > > Best, > > ~dl > > -- > http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
Hi I have been batting with this problem for some time and have been unable to fix it. The nav bar plus the whole 'top' section is lower in IE than FF and other browsers that I have checked on this site. The URL is http://www.campbeltowngrammar.org.uk/ The first links plus the search box are supposed to sit in the centre of the top blue pane. The crest, name of school and next 3 links are to sit in the centre of the main blue pane and there is then a small space and the main nav bar. I have checked the code and it is ok, the other browsers that I have checked it in are Camino, Firefox, Opera and Safari on a Mac all OK. It is only IE 6 on a PC that it is not working. I don't have access to v7.0. Thanks David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
I added the search engine after I had checked the page so it is correct now. I don't see what is wrong with this http://www.education.ea.argyll- bute.sch.uk/" title ="Argll & Bute Education Services">Argyll & Bute which is line 40 Line 40 Column 74 Element type "a" must be followed by either attribute specifications, ">" or "/>". On 17 Mar 2007, at 00:59, ~davidLaakso wrote: > David Roberts wrote: >> I have been batting with this problem for some time and have been >> unable to fix it. >> > > > Same as last time. And the time before that. > > /Start/ with behavior modification. > > Valdate the markup: > <http://validator.w3.org/> > Validate the CSS: > <http://jigsaw.w3.org/css-validator/> > > Bring it back. Someone will help you. > > > Best, > > ~dL > > > > > > > > > >> The nav bar plus the whole 'top' section is lower in IE than FF >> and other browsers that I have checked on this site. >> >> The URL is http://www.campbeltowngrammar.org.uk/ >> >> The first links plus the search box are supposed to sit in the >> centre of the top blue pane. >> >> The crest, name of school and next 3 links are to sit in the >> centre of the main blue pane and there is then a small space and >> the main nav bar. >> >> I have checked the code and it is ok, the other browsers that I >> have checked it in are Camino, Firefox, Opera and Safari on a Mac >> all OK. >> >> It is only IE 6 on a PC that it is not working. I don't have >> access to v7.0. >> >> Thanks >> >> David >> >> >> __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
Hi, I have now validated both the css and xhtml but the original problem with the nav bar is still there as set out below. > The nav bar plus the whole 'top' section is lower in IE than FF > and other browsers that I have checked on this site. > > The URL is http://www.campbeltowngrammar.org.uk/ > > The first links plus the search box are supposed to sit in the > centre of the top blue pane. > > The crest, name of school and next 3 links are to sit in the > centre of the main blue pane and there is then a small space and > the main nav bar. > > I have checked the code and it is ok, the other browsers that I > have checked it in are Camino, Firefox, Opera and Safari on a Mac > all OK. > > It is only IE 6 on a PC that it is not working. I don't have > access to v7.0. On 17 Mar 2007, at 02:37, ~davidLaakso wrote: > David Roberts wrote: >> I added the search engine after I had checked the page so it is >> correct now. >> >> I don't see what is wrong with this >> >> http://www.education.ea.argyll- >> bute.sch.uk/" title ="Argll & Bute Education Services">Argyll >> & Bute >> >> which is line 40 >> Line 40 >> Column 74 >> Element type "a" must be followed by either attribute >> specifications, ">" or "/>". >> >> > > > Dunno. Your markup <http://www.campbeltowngrammar.org.uk/> is valid > on this end. Needless to say, I am having a bad night. Are you > attempting to validate the CSS from the FF Web Developer Toolbar? > Try to validate the CSS using uri: www.campbeltowngrammar.org.uk/mainschool.css> > Or by local file upload, or by direct input with the w3c validation > service. > > Regards, > > ~dL > __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
>>> Hi DL, As I am quite new to using CSS your comment - I think it may be a little over-coded and relying on brittle positioning- would have been more helpful if you had explained what you actual meant. I am interested in learning from my mistakes or wrong way of doing something, it is the only way I will hopefully improve my skills. Thanks for your help, anyway. David __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
Hi Ingo, Thanks for your help. I added margin/padding :0 to the "body" and it has fixed the problem. I am quite new to CSS so I am learning as I go along. The stylesheet was a problem that I was having with my CMS seeing the stylesheet but it is fixed now and I have removed one of the links. Thanks again. David > > >> The nav bar plus the whole 'top' section is lower in IE than FF >> and other browsers that I have checked on this site. >> >> The URL is http://www.campbeltowngrammar.org.uk/ >> h1, h2, h3, h4, h5, h6, p, ul, address { margin:0; padding:0; } ... but what about 'body' and 'form'? They have defaults that are not the same cross browser, too. unrelated: @import "http://www.campbeltowngrammar.org.uk/?css=main/mainschool.css";; Just curious what exactly is the reason for loading the css twice for screen? Ingo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Nav bar position incorrect in IE
Thanks very much for your information, I will give those ideas ago. David On 18 Mar 2007, at 19:05, ~davidLaakso wrote: > David Roberts wrote: >>>>> Hi DL, >>>>> >> >> As I am quite new to using CSS your comment - I think it may be >> a little over-coded and relying on brittle positioning- would >> have been more helpful if you had explained what you actual meant. >> >> I am interested in learning from my mistakes or wrong way of >> doing something, it is the only way I will hopefully improve my >> skills. >> > > Fair enough. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Box dropping down behind footer in IE7
Hi I have a box on the home page (http://fattoad.co.uk/) which is dropping below the footer in IE7 and cutting off some of the text. There should be 30px between the box and the footer. I have tried a number of different tactics but can't get anything to work. Many thanks, David __ 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/