[css-d] IE layout blues
Hi, I am having trouble with several things in IE with a site I'm working on and seek some advice. I'm still grappling with a few areas of css so the issues may be simple, but I just can't see them! Please look at http://www.webanz.com/webanz_new/index3.php. Stylesheets: http://www.webanz.com/webanz_new/styles/layout.css http://www.webanz.com/webanz_new/styles/layout_ie.css http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu.css http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu_ie.css I'm working on a Mac and also have a PC running XP and IE 6. I have run the site through browsershots.org and looks like I'm getting various results particularly in IE 7+ . The issues I see are: 1. IE 6 and down to 5.0: The layout renders basically the same as in Safari and FF (Mac) but the top horizontal (brown) navigation bar is supposed to have sub- menu dropdown items which aren't working. Any ideas what is causing this? I've had several attempts at fixing it, as you will see in the menu_ie.css stylesheet. 2. IE 7 on XP and FF on Win 2000 Have layout issues and drops the left hand background panel down the page. And renders the text in the top horizontal navigation bar in a dark colour! 3. IE 8 Has a few issues with not centering items in the left hand side panel, and also renders the text in the upper hor navbar in a dark colour. Is there some obvious issues I'm not aware of here that can easily be addressed? I take it that it has something to do with hasLayout? Any guidance, pointers, solutions would save me what's left of my hair! Regards, 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/
[css-d] setting a div's width to container remaining available space
is there a way to make div2 below take the entire remaining space of container if i don't know how wide div1 will be? all of them are positioned relative and float to the left? div id=container div id=div1 /div div id=div2 /div /div Thanks Ido __ 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 layout blues
[snip] I am having trouble with several things in IE with a site I'm working on and seek some advice. I'm still grappling with a few areas of css so the issues may be simple, but I just can't see them! [/snip] : Hi Dave, A couple suggestions for testing and general CSS development. First, download IE Tester -- it's a kick butt app for testing IE version 5.5 - 8. Then, download the Firebug plugin for Firefox -- it allows you to play around with the HTML and CSS right in your browser. As a general rule, I develop to Firefox and use conditional comments as IE CSS hacks to get things to display properly in IE. Conditional comment CSS hacks allow you to target specific versions of IE or all of them at once. Use IE Tester to see which versions aren't behaving, then use the IE hacks to target the problem areas. Just in case some of those links don't work in the message board, here are the links I referred to above: - IE Tester download: http://www.my-debugbar.com/wiki/IETester/HomePage (it's in beta, so there are a couple bugs -- still ~totally~ worth downloading) - Firebug plugin for FF: http://getfirebug.com/ - Conditional comment CSS IE hacks: http://www.quirksmode.org/css/condcom.html I hope that helps! Kevin __ 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] Displaying/Simulating handwritten fonts on notebook paper
Hi Yukka,
Thanks for your reply. This looks interesting. I didn't consider this
possiblity. Bruno's implementation is much closer to what our users
were going for, but your technique could be an alternative, if I can
convince them. The main problem is that our users would like whatever
font they choose to be shown to all visitors of their site, and that
pretty much pushes the implementation towards sIFR and similar
Flash-based techniques.
Thanks for your response as well.
--Stephen
-- Forwarded message --
From: Jukka K. Korpela jkorp...@cs.tut.fi
To: CSS-D css-d@lists.css-discuss.org
Date: Mon, 18 May 2009 18:41:57 +0300
Subject: Re: [css-d] Displaying/Simulating handwritten fonts on notebook paper
Stephen Tang wrote:
I encountered a peculiar use case. The business desires to display a
small amount of text as a handwritten font. They want the handwritten
font sitting on blue lines. This would simulate the effect of writing
in a notebook.
You could do something like this:
Markup:
p class=handwrittenspan class=content
the text
/span/p
CSS:
.handwritten {
font-family: Monotype Corsiva, cursive;
text-decoration: underline;
background: white;
color: blue; }
.handwritten:first-line {
text-decoration: underline overline; }
.handwritten .content {
background: transparent;
color: black; }
Omit the second rule if you just want the text to sit on blue lines,
instead of looking like written between blue lines.
Unfortunately there's no way to control the vertical placement of the
underline (and overline).
--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
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 layout blues
I'd like to add my two cents to Kevin's suggestions. I've used IE Tester in the past and found it to be convenient, but it isn't always a perfect representation of how the various versions of IE will handle a particular web site. This is especially true when dealing with advanced cookies or Javascript. Instead, I prefer to use the Virtual PC images made available by Microsoft. The whole setup is free and provides an exact replication of different environments from IE6/XP to IE8/Vista. Virtual PC 2007 (free): http://www.microsoft.com/downloads/details.aspx?FamilyId=04D26402-3199-48A3-AFA2-2DC0B40A73B6displaylang=en Images for IE6, IE7 and IE8: http://www.microsoft.com/downloads/details.aspx?FamilyId=21EABB90-958F-4B64-B5F1-73D0A413C8EFdisplaylang=en - Quiller 2009/5/21 Kevin Doyle sharpspa...@yahoo.com [snip] I am having trouble with several things in IE with a site I'm working on and seek some advice. I'm still grappling with a few areas of css so the issues may be simple, but I just can't see them! [/snip] : Hi Dave, A couple suggestions for testing and general CSS development. First, download IE Tester -- it's a kick butt app for testing IE version 5.5 - 8. Then, download the Firebug plugin for Firefox -- it allows you to play around with the HTML and CSS right in your browser. As a general rule, I develop to Firefox and use conditional comments as IE CSS hacks to get things to display properly in IE. Conditional comment CSS hacks allow you to target specific versions of IE or all of them at once. Use IE Tester to see which versions aren't behaving, then use the IE hacks to target the problem areas. Just in case some of those links don't work in the message board, here are the links I referred to above: - IE Tester download: http://www.my-debugbar.com/wiki/IETester/HomePage(it's in beta, so there are a couple bugs -- still ~totally~ worth downloading) - Firebug plugin for FF: http://getfirebug.com/ - Conditional comment CSS IE hacks: http://www.quirksmode.org/css/condcom.html I hope that helps! Kevin __ 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] Displaying/Simulating handwritten fonts on notebook paper
Stephen Tang wrote: The main problem is that our users would like whatever font they choose to be shown to all visitors of their site, and that pretty much pushes the implementation towards sIFR and similar Flash-based techniques. This does not address your original problem regarding a lined paper effect, but an alternative to image replacement could be Cufon in conjunction with @font-face: http://kilianvalkhof.com/2009/css-xhtml/combining-cufon-and-font-face/ I tried it and found setting up @font-face for IE relatively easy, not the hassle that some implementers describe. Cordially, 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/
Re: [css-d] IE layout blues
Kevin Doyle wrote: [snip] I am having trouble with several things in IE with a site I'm working on and seek some advice. I'm still grappling with a few areas of css so the issues may be simple, but I just can't see them! [/snip] : Hi Dave, A couple suggestions for testing and general CSS development. First, download IE Tester -- it's a kick butt app for testing IE version 5.5 - 8. [...] Hi Kevin - How do you set up IE Tester on Win xp with IE 8 installed? I understand from the site description that it only works with IE 7. Cordially, 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/
Re: [css-d] font image replacement Re: Displaying/Simulating handwritten fonts on notebook paper
Hi David, Thanks for your input on this matter. I read the @font-face for IE article linked in your URL, and building an EOT font sounds like a hassle. In any case, Cufon is probably not going to be good for my use case, since there are SEO and copy/paste requirements. sIFR handles those better the Cufon currently. And last I checked, Cufon has a potential EULA issue with font copyrights that I'm sure the legal team would prefer not to deal with. --Stephen On Thu, May 21, 2009 at 12:25 PM, David Hucklesby huckle...@gmail.com wrote: Stephen Tang wrote: The main problem is that our users would like whatever font they choose to be shown to all visitors of their site, and that pretty much pushes the implementation towards sIFR and similar Flash-based techniques. This does not address your original problem regarding a lined paper effect, but an alternative to image replacement could be Cufon in conjunction with @font-face: http://kilianvalkhof.com/2009/css-xhtml/combining-cufon-and-font-face/ I tried it and found setting up @font-face for IE relatively easy, not the hassle that some implementers describe. Cordially, 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/
Re: [css-d] IE layout blues
Hi Kevin - How do you set up IE Tester on Win xp with IE 8 installed? I understand from the site description that it only works with IE 7. Cordially, David Hmm... Good question and I wish I had an answer for you, David -- I apologize. Perhaps, as a temporary solution, uninstall ie8 then install ie7...? Not sure if you want to lose ie8, though. I'll go through the IETester forum and see what I can find later today, if I can. k. __ 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] Displaying/Simulating handwritten fonts on notebook paper
Hi Vladislav,, Unfortunately, the amount of text could vary, so a static background image is not likely to work. --Stephen -- Forwarded message -- From: Vladislav Vladimirov vladk...@gmail.com To: CSS-D css-d@lists.css-discuss.org Date: Mon, 18 May 2009 17:48:40 +0300 Subject: Re: [css-d] Displaying/Simulating handwritten fonts on notebook paper Why not use a background image of a wrapper to simulate the lines? My first thought was sIFR for the fonts, but I don't think it supports the lines. Is there anything that supports this? Regards, Vladislav http://www.ovalpixels.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] IE layout blues
David Bailey wrote:
Hi,
I am having trouble with several things in IE with a site I'm working
on and seek some advice. I'm still grappling with a few areas of css
so the issues may be simple, but I just can't see them!
Please look at http://www.webanz.com/webanz_new/index3.php.
Stylesheets:
http://www.webanz.com/webanz_new/styles/layout.css
http://www.webanz.com/webanz_new/styles/layout_ie.css
http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu.css
http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu_ie.css
This line above the doctype puts IE/6 in quirksmode.
!-- HEADER INCLUDE Goes here --
If it is deleted and the width of this selector is reduced, you may
avoid the float drop:
#left-panel { border: 1px solid fuchsia;
float: left;
width: /*16%*/15%;
padding-top: 10px;
padding-left: 2%;
padding-right: 2%;
}
It is difficult to bring your page up at all in the IE browsers because
of the js errors.
It would probably be a good idea to validate the markup, too.
http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.webanz.com%2Fwebanz_new%2Findex3.php
I think your chances of getting that site functional in IE/5 is slim to
none.
Perhaps someone else on the list will provide more comprehensive
solutions to all your questions...
__
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] style first p only if it is emphasized?
Dear css-discuss, how might one style the first paragraph, only if it
is emphasized? can it be done without javascript?
Given this html:
div class=content
pemAn intro paragraph which should be highlighted in some
manner,/em embut the [em] might not apply to whole paragraph in a
single piece./em/p
pThis is a normal paragraph which should be left alone./p
/div
div class=content.
pThiis normal paragraph which should also be left alone./p
/div
This css *almost* works, except it breaks the paragraph apart if there
is more than one em :
/* box and center if 1st paragraph in page is emphasized */
.content p:first-child em:first-child {
max-width:35em;
padding: 0.5em;
display: block;
text-align:justified;
margin: 0 10% 0 10%;
}
Perhaps I should be taking another approach altogether?
thanks in advance for your time and thoughts,
--
-matt
__
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] h3 with layout is clearing a float in IE6
We're trying to position a set of h3's and text next to a left-floated navigation list. Straight forward, right? However, we want the h3's to be clickable for some jQuery hide/reveals. We wanted the entire h3 background to be clickable, which in IE seems to require giving the headers hasLayout. Compare the results in FF and IE(6): http://sandbox.hgci2.net/ We gave the h3's hasLayout by specifying their width. As soon as the headers got layout, they jumped below the navigation list. If we remove layout by deleting the width specification, the header (and everything after) jumps back into the flow of their parent div. Why does this happen? Any suggestions for overcoming this? Ideal case: 1) all div#comparisons h3's have layout 2) everything within div#comparisons stays to the right of the navigation list. Note: the page appears to validate CSS/HTML. Thank you, Lev Rickards Office for Sustainability Harvard University http://green.harvard.edu -- Dost thou reckon thyself only a puny form / When within thee the universe is folded? http://reference.bahai.org/en/t/b/SVFV/svfv-6.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] setting a div's width to container remaining available space
Ido dekkers wrote:
is there a way to make div2 below take the entire remaining space of
container if i don't know how wide div1 will be?
all of them are positioned relative and float to the left?
div id=container
div id=div1
/div
div id=div2
/div
/div
Thanks
Ido
Don't float or position the child divs. Just give a percentage width to
the last child element.
#container {float:left;}
#div1 {background:lime;}
#div2 {background:red;width:100%;}
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] h3 with layout is clearing a float in IE6
lev rickards wrote:
http://sandbox.hgci2.net/
Ideal case: 1) all div#comparisons h3's have layout 2) everything
within div#comparisons stays to the right of the navigation list.
Total width of h3 with padding and all is to large to fit, and IE6
doesn't handle overflow properly.
Easiest solution:
1: remove width references on all h3.
2: add...
#comparisons h3 {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] h3 with layout is clearing a float in IE6
lev rickards wrote: We're trying to position a set of h3's and text next to a left-floated navigation list. Straight forward, right? However, we want the h3's to be clickable for some jQuery hide/reveals. We wanted the entire h3 background to be clickable, which in IE seems to require giving the headers hasLayout. Compare the results in FF and IE(6): http://sandbox.hgci2.net/ Any suggestions for overcoming this? Add float:right to the h3 styles and IE 6/7 should come on board (not tested). Too tight tolerance for the IEs. __ 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] Centering in everything but IE8
christi...@netscape.net wrote: Any ideas as to why the main container at: http://www.cmzmedia.com/irarollover/ would center in every browser except for IE8? I ran your invalid file through Tidy Online http://infohound.net/tidy/ and it centered in IE/8 local. __ 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] style first p only if it is emphasized?
Matt Wilkie wrote:
Dear css-discuss, how might one style the first paragraph, only if it
is emphasized? can it be done without javascript?
[code snipped]
Do you have control of the markup? I think I'd add an extra DIV around
such paragraphs, styled via a selector such as this:
.content div p {}
If you do not control markup then, yes, you'd need scripting to add the
DIV to relevant paragraphs for this approach to work.
Cordially,
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/
Re: [css-d] Centering in everything but IE8
christi...@netscape.net wrote: Any ideas as to why the main container at: http://www.cmzmedia.com/irarollover/ would center in every browser except for IE8? I'm guessing you are using scripting to center in IE, as the incomplete DOCTYPE throws all IE into quirks mode. I also notice the page loads left aligned in IE 6, then shifts to the center after a delay. If it is the script, it wouldn't be the first to fail in IE 8. Cordially, 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/
[css-d] wrapper content extending into footer in Safari/Win and Opera
On my site, the wrapper text is flowing down past the footer: http://www.redkitecreative.com/projects/mgwa/meetings.php Can someone please help? -- Debbie Campbell 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] wrapper content extending into footer in Safari/Win and Opera
Debbie Campbell wrote: On my site, the wrapper text is flowing down past the footer: http://www.redkitecreative.com/projects/mgwa/meetings.php Can someone please help? You may have closed a division too early? Validate the markup and see if that helps... __ 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 layout blues
Hi Kevin, On 22/05/2009, at 12:51 AM, Kevin Doyle wrote: - IE Tester download: http://www.my-debugbar.com/wiki/IETester/ HomePage (it's in beta, so there are a couple bugs -- still ~totally~ worth downloading) I've downloaded this and it looks quite good. This and probably Quiller's suggestion is very helpful. I only have one PC and not able to check the different browsers as I make adjustments, and I was envisaging having to check in the screenshots of browsershots.org every change I make!. I guess the quality and bugs will be sorted out over time in this program. It didn't like the javascript error that is apparently part of the navbar (from Web Assist's CSS Menu Writer), so I'll have to sort that out first before I can use it properly. - Firebug plugin for FF: http://getfirebug.com/ I have used this plugin on my Mac, and have just downloaded the pc version. Great tool. - Conditional comment CSS IE hacks: http://www.quirksmode.org/css/ condcom.html I am aware of the value of these conditional comments and, as the header of the page shows, I have used them on this site. But my real issue is as mentioned above, how do I start testing for each of these browsers. Also, I'm relatively new to css, or, at least somewhat out of touch with it for a while and things have moved along quite rapidly it appears! Thanks for your suggestions and advice. Regards, 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/
Re: [css-d] IE layout blues
On 22/05/2009, at 3:30 AM, Quiller wrote: I'd like to add my two cents to Kevin's suggestions. Instead, I prefer to use the Virtual PC images made available by Microsoft. The whole setup is free and provides an exact replication of different environments from IE6/XP to IE8/Vista. Virtual PC 2007 (free): http://www.microsoft.com/downloads/details.aspx? FamilyId=04D26402-3199-48A3-AFA2-2DC0B40A73B6displaylang=en Images for IE6, IE7 and IE8: http://www.microsoft.com/downloads/details.aspx? FamilyId=21EABB90-958F-4B64-B5F1-73D0A413C8EFdisplaylang=en Thanks, Quiller. Looks great, and downloading now. Should be a great help. 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/
Re: [css-d] IE layout blues [correction to url]
On 22/05/2009, at 5:30 AM, David Laakso wrote:
This line above the doctype puts IE/6 in quirksmode.
!-- HEADER INCLUDE Goes here --
Okay, that does change things dramatically. Obviously, I need to
learn more about quirksmode. It now acts more like IE 7 in dropping
the content of the left-hand panel, and aligning the content to the
left. It appears I've been making adjustments to the IE style sheet
to suit quirksmode, because it now works better using the
If it is deleted and the width of this selector is reduced, you may
avoid the float drop:
#left-panel { border: 1px solid fuchsia;
float: left;
width: /*16%*/15%;
padding-top: 10px;
padding-left: 2%;
padding-right: 2%;
}
Okay, I've made a couple of other adjustments now to the other floats
and they all sit together better (along the lines of the main style
sheet), so the above adjustment wasn't necessary. I've now got to try
and solve the right alignment problem.
It is difficult to bring your page up at all in the IE browsers
because of the js errors.
Yes, I only became aware of this later for something but it seemed to
point to the javascript in the menu (produced by Web Assist's CSS
Menu Writer). But I have another page (http://www.webanz.com/
webanz_new/int-tmpl-3col-3.php ) which for some reason, while it was
affected by eliminating quirksmode, didn't show the same changes as
did the index page. Also, the javascript error doesn't show up on
this page, so I'm thinking that the javascript error has something to
do with the image rollover sequence on the home page (produced by
Dreamweaver 8, as I don't know javascript well enough). I'm sure I've
seen that this sort of thing can be done using CSS, so I'll look into
that.
It would probably be a good idea to validate the markup, too.
http://validator.w3.org/check?verbose=1uri=http%3A%2F%
2Fwww.webanz.com%2Fwebanz_new%2Findex3.php
That's weird! I did this before posting my question! I validated both
the html and the css and all validated fine!
Okay, I've just realised my mistake. I gave you an incorrect url!
Nevertheless, the issues are the same and it is the same style sheet.
The correct URL is:
http://www.webanz.com/webanz_new/index4.php
...which validates fine: http://validator.w3.org/check?uri=http%3A%2F%
2Fwww.webanz.com%2Fwebanz_new%2Findex4.phpcharset=%28detect
+automatically%29doctype=Inlinegroup=0verbose=1user-
agent=W3C_Validator%2F1.654
My apologies!
I think your chances of getting that site functional in IE/5 is
slim to none.
Are you meaning, the structure of the site won't suit IE/5, or that
IE/5 is beyond working with?
Thanks for your efforts to help!
Regards,
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/
Re: [css-d] IE layout blues [correction to url]
I think your chances of getting that site functional in IE/5 is slim to none. Are you meaning, the structure of the site won't suit IE/5, or that IE/5 is beyond working with? Thanks for your efforts to help! Regards, David The comment was based on the erroneous uri you provided, and that given that erroneous address, the page was worse than upside down and backward in IE/5.01. Whether you wish to support IE/5.01 and IE/5.5 with the correct uri is your call. Some of us have difficulty, if not having given up on, providing continued pixel perfect rendition in IE/6. __ 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/
