Re: [css-d] IE6 ruins Holy Grail Layout with innocuous javascript
Chris Hardie wrote: I've seen a lot, but this is a new one and a doozy: http://142.177.155.236/test.asp ... Now, click on the Change alt text of right-hand image button. The left-hand column is now thrown over 375 pixels, and the alert now indicates an x-position of 380px! ... I did not check your page, but see if this helps. http://www.satzansatz.de/cssd/hgjump.html regards, Ingo -- http://www.satzansatz.de/css.html http://www.dolphinsback.com __ css-discuss [EMAIL PROTECTED] 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] Browser compatibility with basic background formats?
My body background specific code is thus:
body {
background-color: #D8BAEC;
background-image: url(images/bggradient1.jpg);
background-repeat: repeat-y;
text-align: left;
margin: 0px;
padding: 0px;
color: #611E41;
}
Hi,
I had run into a similar issue and faintly recalling what i did was club all
background parameters into:
background: #D8BAEC
url(images/bggradient1.jpg) repeat-y;
Can you try this, in case you havent, and let me know if it works
Thanks
Parag
--
~Parag
\m/
__
css-discuss [EMAIL PROTECTED]
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] Latest Rounded Corners
Here's another list of several techniques: http://www.smileycat.com/miaow/archives/44.php Best regards, Christian *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza Chris Akins schrieb: I know there are many rounded corner techniques out there, and I'm not looking to start a war. :-) But I was wondering if there are any especially good, newer techniques to the game. I need my rounded box to be resizable, and kind of like the idea of using only one small circle image that gets offset for each corner. Prefer no javascript for this. I did start with Google, but quite a few of the promising link titles lead to pages no longer there, so I hoping this list could point me to recent improvements in this area. Thanks as always for the expertise here. Chris __ css-discuss [EMAIL PROTECTED] 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 [EMAIL PROTECTED] 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] Latest Rounded Corners
There's another technique at: http://www.cssplay.co.uk/boxes/krazy.html By Stu Nicholls. __ css-discuss [EMAIL PROTECTED] 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] IE6 vertical margin and padding differences
Hi there, this is hopefully an easy one, but I'm struggling to find a clean
solution for IE6 without resorting to adding an extra div, floating the h1
element, or removing the container's width (all of which are inconvenient for
various reasons) -
Problem here is that IE6 doesn't honour both the container's padding-top and
the child's margin-top. Compare the following result in FF and IE6:
Markup:
Heading 1
CSS:
*{margin:0;padding:0;}
#content{
width:500px;
padding-top:100px;
background:red;
}
h1{
margin-top:100px;
background:blue;
}
any help much appreciated,
James
__
css-discuss [EMAIL PROTECTED]
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] IE6 vertical margin and padding differences
James Smith wrote:
Hi there, this is hopefully an easy one, but I'm struggling to find a clean
solution for IE6 without resorting to adding an extra div, floating the h1
element, or removing the container's width (all of which are inconvenient for
various reasons) -
Problem here is that IE6 doesn't honour both the container's padding-top and
the child's margin-top. Compare the following result in FF and IE6:
Nothing is easy.
* html #content{
padding-top:200px;
}
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
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] IE6 vertical margin and padding differences
What about adding the underscore hack ?
h1 {
...
_margin-top:200px;
}
That will get the same result in IE6 as the one in FF.
James Smith wrote:
Hi there, this is hopefully an easy one, but I'm struggling to find a clean
solution for IE6 without resorting to adding an extra div, floating the h1
element, or removing the container's width (all of which are inconvenient for
various reasons) -
Problem here is that IE6 doesn't honour both the container's padding-top and
the child's margin-top. Compare the following result in FF and IE6:
Markup:
Heading 1
CSS:
*{margin:0;padding:0;}
#content{
width:500px;
padding-top:100px;
background:red;
}
h1{
margin-top:100px;
background:blue;
}
any help much appreciated,
James
__
css-discuss [EMAIL PROTECTED]
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 [EMAIL PROTECTED]
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] IE6 ruins Holy Grail Layout with innocuous javascript
Hi Ingo,
That does seem to have quelled the issue, many thanks. FWIW, I applied
display:inline-block to the innerwrapper to trigger hasLayout, and in my
specific case it appears to work. I then created the following rule in
case other browsers had difficulties with it: html body #innerwrapper
{ display: block; }
Many thanks Ingo!
C.
Ingo Chao wrote:
Chris Hardie wrote:
I've seen a lot, but this is a new one and a doozy:
http://142.177.155.236/test.asp
...
Now, click on the Change alt text of right-hand image button. The
left-hand column is now thrown over 375 pixels, and the alert now
indicates an x-position of 380px! ...
I did not check your page, but see if this helps.
http://www.satzansatz.de/cssd/hgjump.html
regards,
Ingo
__
css-discuss [EMAIL PROTECTED]
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] IE6 vertical margin and padding differences
Thanks, I'll use one of those.
Do you know why this is happening? I thought I had encountered most IE bugs
before, but this doesn't seem to fall under any I've heard of - it doesn't even
seem to be down to the box model differences since I've not specified a height
on anything. It seems that the margin and padding are collapsing together since
IE6 will obey whichever one is higher in value, but not both.
Date: Fri, 23 May 2008 18:05:11 +0300
From: [EMAIL PROTECTED]
To: [EMAIL PROTECTED]
CC: css-d@lists.css-discuss.org
Subject: Re: [css-d] IE6 vertical margin and padding differences
What about adding the underscore hack ?
h1 {
...
_margin-top:200px;
}
That will get the same result in IE6 as the one in FF.
James Smith wrote:
Hi there, this is hopefully an easy one, but I'm struggling to find a clean
solution for IE6 without resorting to adding an extra div, floating the h1
element, or removing the container's width (all of which are inconvenient
for various reasons) -
Problem here is that IE6 doesn't honour both the container's padding-top
and the child's margin-top. Compare the following result in FF and IE6:
Markup:
div id=content
h1Heading 1/h1
/div
CSS:
*{margin:0;padding:0;}
#content{
width:500px;
padding-top:100px;
background:red;
}
h1{
margin-top:100px;
background:blue;
}
any help much appreciated,
James
__
css-discuss [EMAIL PROTECTED]
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] IE6 vertical margin and padding differences
--- James Smith [EMAIL PROTECTED] wrote: Do you know why this is happening? I thought I had encountered most IE bugs before ... it doesn't even seem to be down to the box model differences since I've not specified a height on anything. It definitely looks like a hasLayout problem - this is probably the flavour of bug you're thinking of. As you say, setting height triggers hasLayout, but so does setting width (1). Looks like margin / padding is one of the victims (2). I *despise* hacks, though it may be your only option in this case. Are you sure you can't make semantic use out of a wrapper div? That, to me, would seem the lesser of two evils. - Bobby (1) See the 'classic': http://www.satzansatz.de/cssd/onhavinglayout.html#prop (2) http://www.brunildo.org/test/IEMarginCollapseLayout.html __ css-discuss [EMAIL PROTECTED] 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 6 bug - thx for the help!
thank you gunlaug - writing in position: relative; to the problem div in IE 6 worked - - http://www.fatgraffix.com/2008-test-01/index-fix.html =fgx= __ css-discuss [EMAIL PROTECTED] 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] Table column width
I have a 2-cell table I am trying to style with css: http://datagnostics.com/test/tablecells.html What I want is: 1. table width is fixed 2. cell with image in it is just the width of the image, even if I don't know ahead of time how wide the image will be. 3. the other cell should adjust its width as necessary. How do I do this so it works in both IE6 IE7, as well as standards-compliant browsers? Mary Ellen, Doctor Science http://doctorscience.blogspot.com __ css-discuss [EMAIL PROTECTED] 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] Skin Test Request
Hi, We need help in testing whether the HTML found at http://newwavecell.com/design/Index.html is skinnable. The goal is to accomodate as many designs as possible without having to alter the underlying HTML. The designer should be able to make menus appear differently (vertical, horizontal, drop down, multi-level etc.) and also be able to position the site menu anywhere (may be on right side instead of left). Is it possible for someone to examine HTML and may be try to create a different skin for this HTML. You can reply with your CSS and/or Javascripts and I can post it as alternate skins on the site. Thanks for your help. Regards, Sohail __ css-discuss [EMAIL PROTECTED] 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] Drop down Menu not clickable.
Hi, We have a CSS driven drop down menu but we have two issues with it: a. The options which are falling in the content area of the page, are not clickable. b. Some options seem to be hidden under the content. http://www.newwavecell.com/design/Index.html Is this something that can be quickly fixed? Regards, Sohail __ css-discuss [EMAIL PROTECTED] 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 check please - WHIWB
Would appreciate a site check/thorough vetting of
www.whitehouseinwestbend.com
http://www.whitehouseinwestbend.com/whitehousebaseformatcss.css
http://www.whitehouseinwestbend.com/whitehousepagecss.css
Comments regarding ease of use/accessibility, fonts, colors, etc always
welcome.
Thanks in Advance, and Cheers,
Peter
Seems to be working alright cross-browser except for a minor issue in IE/6
where the vertical rules are filling all the way up.
Tweak both to -3 or -2px and test:
* html #leftsidebar {
margin-right: -10px;
}
* html #side2 {
margin-left:-10px;
}
05/23/2008
David:
Thanks. I set the margins to -2px; and I still lose part of the vertical
rules in WIN2K/IE6 at work, although the floats stay in place. I have
changed them to -1px. Would you please take a quick look and let me know if
'that' has resolved the issue. Otherwise I will cut the width on the center
column by a few px to see if that works.
I know the font size is a problem. Will tweak around a bit to see what I can
improve. The fixed width 3-column layout cures some ills, causes others ..
like this! What do you think about 3 equal width columns?
Best,
Peter
__
css-discuss [EMAIL PROTECTED]
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] Drop down Menu not clickable.
I tried putting a z-index:50 on #mainnavul and it now works. The 50 part probably doesn't have to be that specific number, but I just put some arbitrary thing in there that I figured would be higher than the z-index of the content. I only tested this in Firefox Mac. Chris A On Fri, May 23, 2008 at 4:04 PM, Sohail Aboobaker [EMAIL PROTECTED] wrote: Hi, We have a CSS driven drop down menu but we have two issues with it: a. The options which are falling in the content area of the page, are not clickable. b. Some options seem to be hidden under the content. http://www.newwavecell.com/design/Index.html Is this something that can be quickly fixed? Regards, Sohail __ css-discuss [EMAIL PROTECTED] 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 [EMAIL PROTECTED] 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] Skin Test Request
Sohail Aboobaker wrote:
Hi,
We need help in testing whether the HTML found at
http://newwavecell.com/design/Index.html is skinnable. The goal is to
accomodate as many designs as possible without having to alter the
underlying HTML.
The designer should be able to make menus appear differently (vertical,
horizontal, drop down, multi-level etc.) and also be able to position the
site menu anywhere (may be on right side instead of left).
Is it possible for someone to examine HTML and may be try to create a
different skin for this HTML. You can reply with your CSS and/or Javascripts
and I can post it as alternate skins on the site.
Thanks for your help.
Regards,
Sohail
*#panneltwo
{
float: left;
}
#pannelone
{
float: right;
}*
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
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 check please - WHIWB
Peter Hyde-Smith wrote: Would appreciate a site check/thorough vetting of www.whitehouseinwestbend.com http://www.whitehouseinwestbend.com/whitehousebaseformatcss.css http://www.whitehouseinwestbend.com/whitehousepagecss.css Peter David: Thanks. I set the margins to -2px; and I still lose part of the vertical rules in WIN2K/IE6 at work, although the floats stay in place. I have changed them to -1px. Would you please take a quick look and let me know if 'that' has resolved the issue. Otherwise I will cut the width on the center column by a few px to see if that works. In XP IE/6 (standalone) you are dropping both the left and right column. We' ll both need to hear from someone with native IE/6 boxes on win/2k and win/xp for a proper cross operating system fix in IE/6.0. Best, Peter __ css-discuss [EMAIL PROTECTED] 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] Table column width
On May 24, 2008, at 3:26 AM, Mary Ellen Curtin wrote: I have a 2-cell table I am trying to style with css: http://datagnostics.com/test/tablecells.html What I want is: 1. table width is fixed 2. cell with image in it is just the width of the image, even if I don't know ahead of time how wide the image will be. 3. the other cell should adjust its width as necessary. How do I do this so it works in both IE6 IE7, as well as standards-compliant browsers? Is the cell containing the image always in the same column ? Then this out to work, I think: http://dev.l-c-n.com/_temp/tablecells.html Basically, lock down the width of the column to something narrow; the cell(s) will expand to the width of the largest image. I use the col element to do this. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] 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/
