[css-d] Site Test Please
Hi Everyone, I work on a Mac and the site I¹m working on looks OK on that on most browsers. I even got it working OK in IE Mac. However, I have had a look on Browsershots.org at the Windows IE versions and noticed a couple of problems: * Version 6 a stray 1 pixel line appears right across the main div under the ID picture on each page and through the navigation bar * Version 5 a lot of things go wrong of course and I¹m not sure how to approach it to hack or not to hack? The main culprit is the membership page where all sorts of weirdness is happening with the mini navigation (the green nav). My question what should I do? Do I abandon Windows IE v5? It is really tempting. I¹d also like some input on if it works OK please, browsershot.org is OK but you can¹t see if everything is working as expected. Bear in mind it is still a work in progress and a lot of the content is temporary/incomplete. http://www.katekelly.org.uk/BAVO/index.htm The style sheet is here: http://www.katekelly.org.uk/BAVO/bavoStyles.css Thanks for your time, Kate Kelly __ 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] site test please
URL: http://www.northsidecreativeservices.org/design.htm CSS: http://www.northsidecreativeservices.org/cs.css Could someone please test the above URL in IE6 and IE7? I heard that someone was looking at the site, and the top nav (blog, design services, banners & signs, production) was stacked vertically rather than in line horizontally. I tested it in IE8, Chrome, Opera, Safari, and FF (Mac and Win), and they all display it correctly (in line horizontally). browsershots.org wasn't working with this URL for some reason. Thanks, Daniel Hammond __ 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] site test please
It's vertical in FF2 as well...I'll look at it a bit later and see if I can see why __ 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] site test please
Your problem is that IE 6 and 7 don't have support for inline-block. (Neither does FF2, since it was still -moz-inline-block then). I believe that the work around (in IE) is to give the element hasLayout, and a display: inline instead, but I don't have much experience with that, so I'll leave it to more experienced people on the list. ---Tim __ 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] site test please
David Laakso wrote: > Daniel Hammond wrote: >> URL: http://www.northsidecreativeservices.org/design.htm >> CSS: http://www.northsidecreativeservices.org/cs.css >> >> Could someone please test the above URL in IE6 and IE7? I heard >> that someone was looking at the site, and the top nav (blog, >> design services, banners & signs, production) was stacked >> vertically rather than in line horizontally. I tested it in IE8, >> Chrome, Opera, Safari, and FF (Mac and Win), and they all display >> it correctly (in line horizontally). >> >> browsershots.org wasn't working with this URL for some reason. >> >> Thanks, >> Daniel Hammond >> > > > Try changing all instances in #nav > from: > display: inline-block; > to: > display: inline; That fixed the initial problem, but it also messed with the height of the nav. It appears that "line-height" no longer affects it. The nav also no longer touches the top of the white area as it's supposed to. Daniel __ 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] site test please
Daniel Hammond wrote: > David Laakso wrote: > >> Daniel Hammond wrote: >>> URL: http://www.northsidecreativeservices.org/design.htm >>> CSS: http://www.northsidecreativeservices.org/cs.css >>> >>> Could someone please test the above URL in IE6 and IE7? I heard >>> that someone was looking at the site, and the top nav (blog, >>> design services, banners & signs, production) was stacked >>> vertically rather than in line horizontally. I tested it in IE8, >>> Chrome, Opera, Safari, and FF (Mac and Win), and they all display >>> it correctly (in line horizontally). >>> >>> browsershots.org wasn't working with this URL for some reason. >>> >>> Thanks, >>> Daniel Hammond >>> >> >> >> Try changing all instances in #nav >> from: >> display: inline-block; >> to: >> display: inline; > > That fixed the initial problem, but it also messed with the height of > the nav. It appears that "line-height" no longer affects it. The nav > also no longer touches the top of the white area as it's supposed to. > > Daniel > On this end IE 6/7/8 are nearly identical. The only difference is IE 6 and IE 7 have aprox +1px white space above the border. Tweak the line-height: use a unit-less (raw) number. 1.68 not 1.68px, for example. This filter targets IE 6 and below * html {} This filter targets IE 7 only *:first-child+html {} __ 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] site test please
Daniel Hammond wrote: > URL: http://www.northsidecreativeservices.org/design.htm > CSS: http://www.northsidecreativeservices.org/cs.css > > Could someone please test the above URL in IE6 and IE7? I heard that > someone was looking at the site, and the top nav (blog, design > services, banners & signs, production) was stacked vertically rather > than in line horizontally. I tested it in IE8, Chrome, Opera, Safari, > and FF (Mac and Win), and they all display it correctly (in line > horizontally). > > browsershots.org wasn't working with this URL for some reason. > > Thanks, > Daniel Hammond > Try changing all instances in #nav from: display: inline-block; to: display: inline; __ 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] site test please
In IE6/WinXp, in left side pan, bullets are aligned wrongly before grey box. On Fri, Sep 11, 2009 at 3:33 AM, David Laakso wrote: > Daniel Hammond wrote: > > David Laakso wrote: > > > >> Daniel Hammond wrote: > >>> URL: http://www.northsidecreativeservices.org/design.htm > >>> CSS: http://www.northsidecreativeservices.org/cs.css > >>> > >>> Could someone please test the above URL in IE6 and IE7? I heard > >>> that someone was looking at the site, and the top nav (blog, > >>> design services, banners & signs, production) was stacked > >>> vertically rather than in line horizontally. I tested it in IE8, > >>> Chrome, Opera, Safari, and FF (Mac and Win), and they all display > >>> it correctly (in line horizontally). > >>> > >>> browsershots.org wasn't working with this URL for some reason. > >>> > >>> Thanks, > >>> Daniel Hammond > >>> > >> > >> > >> Try changing all instances in #nav > >> from: > >> display: inline-block; > >> to: > >> display: inline; > > > > That fixed the initial problem, but it also messed with the height of > > the nav. It appears that "line-height" no longer affects it. The nav > > also no longer touches the top of the white area as it's supposed to. > > > > Daniel > > > > > > > On this end IE 6/7/8 are nearly identical. > > The only difference is IE 6 and IE 7 have aprox +1px white space above > the border. Tweak the line-height: use a unit-less (raw) number. 1.68 > not 1.68px, for example. > > This filter targets IE 6 and below >* html {} > > This filter targets IE 7 only >*:first-child+html {} > > > > > > > > > > > > > __ > 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/