Re: [css-d] help with margin-top IE versus FF
I solved it by applying float:left to the bottom div. Not sure why it fixed it, but I'm not going to argue with it! -Original Message- From: David Laakso [mailto:[EMAIL PROTECTED] Sent: Monday, November 10, 2008 6:03 PM To: Angela French Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] help with margin-top IE versus FF Angela French wrote: I have two divs that sit on top of each other (in the html). I have applied a margin-top to the bottom div to provide space between the 2 divs. IE7 renders the margin-top, but FF2 won't. I have tried !important; but cannot get some space between them. Angela French Is the problem resolved in Firefox/3.0.3; and if not, could you provide a clickable link to the page/problem in question? -- A thin red line and a salmon-color ampersand forthcoming. 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] help with margin-top IE versus FF
Angela French wrote: I solved it by applying float:left to the bottom div. Not sure why it fixed it, but I'm not going to argue with it! Educated guess: you experienced a collapsing margins case... http://www.w3.org/TR/CSS21/box.html#collapsing-margins ...which 'float: left/right' on the right element fixes. IE/win was probably already saved by its 'hasLayout' bug. regards Georg -- http://www.gunlaug.no __ 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] eliminate horizontal scrollbars
Is there a way to eliminate horizontal scroll bars besides widening the content area (or decreasing the inner contents)? Thanks for any info on this! Cecelia __ 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] css picture gallery with IE
Hi, I've been working on a site, which has several small image galleries of different buildings. Bigger image shows when thumbnail is hovered over. In FF and Safari the bigger images show nicely on the right side of the thumbnails with top of the image aligned with the top of the thumbnails. In IE, however, the top of the bigger image is a bit lower than the thumbnails and when there are thumbnails in three or more rows, the bigger image drops even more down, approximately the height of one thumbnail. So it looks like IE thinks that the bigger image is positioned somehow relatively with the thumbnails..? For example here there are two rows of thumbnails and IE shows the bigger image 1.5em or so below the line it should be in: http://www.mondiara.com/x_tlehto.php?lang=en In here there are three rows of thumbnails and the bigger image sinks lower: http://www.mondiara.com/x_mia.php?lang=en Four rows of thumbnails and bigger image is even lower: http://www.mondiara.com/x_kantama.php?lang=en css is here (gallery part from line 207, almost half way down): http://www.mondiara.com/mondiara.css Hopefully someone can figure out where the problem is, I've been staring at the code for too long and can't come up with anything any more.. :-/ regards, --patrik __ 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] funny css font issue
I have a simple site, here is the source:
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;
html lang=en
head
meta http-equiv=content-type content=text/html;
charset=iso-8859-1
titleUntitled/title
meta name=generator content=BBEdit 8.7
style
body {
margin: 0;
font-family: Baskerville, Heisi Mincho W3, Symbol, serif;
}
.wrapper {
border: 0px solid red;
margin-left: 2em;
}
/style
/head
Pretty basic, all is well in Fx and Safari. I looked at it on Windows
in IE the other day, and this is what i see:
http://www.newgeo.com/web/misc/153316-Picture%201.png
--
Scott
__
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] Off Topic -Fony Dropdown List - How?
What should I be looking at to have my website offer a drop down list (or ANY list) of fonts available on the users computer so they can choose a font they want to see on my website? Javascript? PHP? is there a certain name for this? Thanks Lou __ 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] Flash swf covers DW sprymenu drop downs
Hello, This is my first time with an inquiry. On October 2nd members Jimmy and Lourens had an exchange regarding this issue. Lourens suggested using SWFObject and this apparently solved Jimmy's problem. I too have this problem (on all browsers) and tried the wmode=transparent parameter approach which didn't work - unless I've done something wrong there. I am hoping that Jimmy or someone who's used it before, can explain in easy steps, how to incorporate SWFObject 2.0 into my xhtml page, or do what is necessary with the download. I am not a programmer and feel the need to cry when I try to sort through all the info here http://code.google.com/p/swfobject/wiki/ api . I realize that it involves changing the java srcript embed code, but how do I use this with the SWFObject that I've downloaded. Thank you, Barbara div class=map object classid=clsid:D27CDB6E-AE6D-11cf-96B8-44455354 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version =9,0,28,0 width=362 height=310 param name=movie value=flash/commPort.swf / param name=quality value=high / param name=wmode value=transparent / embed src=flash/commPort.swf quality=high pluginspage=http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash type=application/x-shockwave-flash width=362 height=310/embed /object /div __ 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] Flash swf covers DW sprymenu drop downs
sorry, here's the link if it helps to see: http://www.natureinthecity.org/Nic_Css_Dev/community.html .. Barbara __ 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] funny css font issue
On Nov 13, 2008, at 8:33 AM, Scott Haneda wrote:
I have a simple site, here is the source:
...
body {
margin: 0;
font-family: Baskerville, Heisi Mincho W3, Symbol, serif;
}
.wrapper {
border: 0px solid red;
margin-left: 2em;
}
/style
/head
Pretty basic, all is well in Fx and Safari. I looked at it on Windows
in IE the other day, and this is what i see:
http://www.newgeo.com/web/misc/153316-Picture%201.png
Not surprising, really. 'Baskerville' and Heisi Mincho W3 are not
available by default on the Windows platform, afaik. The browser (IE)
then uses the third choice in your list: 'Symbol'. Which is wrong by
itself. It should fall back to the default specified font (serif), as
'Symbol' is not a font that can be used to display alphanumerical
characters.
What is your reasoning for using those specific fonts ?
PS - Heisi Mincho W3 is misspelled in your list. 'Heisi' -- 'Heisei'
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/
Re: [css-d] Off Topic -Fony Dropdown List - How?
From: Lou Hernsen [EMAIL PROTECTED] What should I be looking at to have my website offer a drop down list (or ANY list) of fonts available on the users computer so they can choose a font they want to see on my website? Javascript? PHP? is there a certain name for this? To allow a user to use their favorite font on your website, simply do not set a font family anywhere in your style sheet. The user's browser preferences will prevail without any need for scripting. ~holly __ 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 with active state on main menu
Howdy all,
I'm doing the standard sons-of-suckerfish menu (and have been using it
a while) but with a new site I'm being requested to have an active
state where the current section is highlighted in the main nav.
Of course, it works fine in Safari, Firefox, but not IE.
I suspect it's something with adding an additional class with
the :hover pseudo class, but I'm not sure how it should be formatted.
relevant CSS and html as follows: (where on is the class that
highlights the active section)
---
li class=ona href=comm.htmlCommunication
Tools/a
ul
lia
href=test.htmlTest 2/a/li
lia
href=test.htmlTest 3/a/li
lia
href=test.htmlTest 4/a/li
lia
href=test.htmlTest 5/a/li
/ul
/li
---
#top_menu li:hover ul, #top_menu li.on:hover ul, #mainnav li.sfhover
ul, #mainnav li.on.sfhover ul {
left: auto;
}
---
I changed the normal left: -999em; on the ul to a -9em to see if
the menu was showing up at all, and it indeed shows, but it doesn't
move. So it would seem the problem is with mixing the extra class
with the :hover pseudo class.
Any ideas?..
Thanks!
-- Karl
__
Karl W. Jacobs
Supervisor - Web Communications
The Aerospace Corporation
310.336.7345
__
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] funny css font issue
On Nov 12, 2008, at 4:10 PM, Philippe Wittenbergh wrote:
On Nov 13, 2008, at 8:33 AM, Scott Haneda wrote:
I have a simple site, here is the source:
...
body {
margin: 0;
font-family: Baskerville, Heisi Mincho W3, Symbol, serif;
}
.wrapper {
border: 0px solid red;
margin-left: 2em;
}
/style
/head
Pretty basic, all is well in Fx and Safari. I looked at it on
Windows
in IE the other day, and this is what i see:
http://www.newgeo.com/web/misc/153316-Picture%201.png
Not surprising, really. 'Baskerville' and Heisi Mincho W3 are not
available by default on the Windows platform, afaik. The browser (IE)
then uses the third choice in your list: 'Symbol'. Which is wrong by
itself. It should fall back to the default specified font (serif), as
'Symbol' is not a font that can be used to display alphanumerical
characters.
What is your reasoning for using those specific fonts ?
PS - Heisi Mincho W3 is misspelled in your list. 'Heisi' --
'Heisei'
Wierd, how did I not catch that, that was a bad copy and paste of a
font set if I have ever seen one, thanks.
--
Scott
__
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 with active state on main menu
On Thu, Nov 13, 2008 at 12:04 PM, Karl Jacobs [EMAIL PROTECTED] wrote: Any ideas?.. I don't believe IE supports chaining multiple classes. i.e. #mainnav li.on.sfhover ul I'm not sure if you can remove one of those classes and still keep the functionality that you require. If you need both classes in the selector you could change the on class into an ID, but you'd probably need to give it a more unique name. e.g. #mainnav li#mainnav_on.sfhover ul That should work in IE. -- Blake Haswell http://www.blakehaswell.com/ | http://blakehaswell.wordpress.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] drop-down with active state on main menu
Not working yet... hmmm
#top_menu li:hover ul, #top_menu li#on:hover ul, #top_menu li.sfhover
ul, #top_menu li#on.sfhover ul {
left: auto;
}
The on state won't move the drop-down menu into the proper position
still.
Anyone got an example using suckerfish with an active state on the
main nav?..(never done it before myself, as I'm usually dropping
the nav in a include file, which would rule out active state).
Thanks,
-- Karl
On Nov 12, 2008, at 5:23 PM, Blake wrote:
On Thu, Nov 13, 2008 at 12:04 PM, Karl Jacobs [EMAIL PROTECTED]
wrote:
Any ideas?..
I don't believe IE supports chaining multiple classes. i.e. #mainnav
li.on.sfhover ul
I'm not sure if you can remove one of those classes and still keep the
functionality that you require.
If you need both classes in the selector you could change the on
class into an ID, but you'd probably need to give it a more unique
name. e.g.
#mainnav li#mainnav_on.sfhover ul
That should work in IE.
--
Blake Haswell
http://www.blakehaswell.com/ | http://blakehaswell.wordpress.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/
__
Karl W. Jacobs
Supervisor - Web Communications
The Aerospace Corporation
310.336.7345
__
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/7 (standards-mode) dynamic width divs (using percentages and float:left) seem to spill when = 100%?
Hi there, I've been reading quite a bit about the various IE box model float-related work-arounds, but I haven't encountered anything yet to my knowledge that addresses or explains the issue that I'm seeing with IE6/7 (thankfully, IE5.x is old enough to be out of the picture for this project). Basically, my intention is to create dynamic widths, evenly divided amongst several columns totalling up to 100% of the containing div (yes, this is more or less doable with tables, but I'm trying to determine why this is so troublesome with divs). Here's the simplest example I could think of: ... div id=x div id=x_1part1/div div id=x_2part2/div /div ... http://emparq.com/scratch/test1.html Note that: - the width of parent div is unspecified (to allow resizing) - each child div (containing the text 'part1' and 'part2') * gets 50% of the width (thus totalling 100%) * floated to the left ...when resizing the browser window in IE6/7, sometimes 'part 2' will apparently exceed the container width, and spill over into the next row (placed under 'part 1'). This looks like something float or box-model-related, as quirks-mode doesn't seem to suffer this problem: (note: only the DOCTYPE directive was removed) http://emparq.com/scratch/test0.html ...and while that's all well and good, quirks-mode isn't really a viable option. Moving on, I tried removing the 'width' and 'float' css properties from the 2nd child div (the one containing the text 'part2') to let it consume the remainder of the parent's width: http://emparq.com/scratch/test2.html ...which does succeed at rendering how I wanted. But really, what I'm trying to understand is why floated divs with widths totalling up to 100% causes spillover? And is there a way to prevent that (perhaps using some obscure combination of css properties?), while leaving the 'float' and 'width' properties intact? Some other attempts: (that didn't correct the behavior): - setting 'overflow:visible' - setting 'margin', 'padding', and 'border' to 0 on child divs - 'zoom:1' (I don't think 'hasLayout' should be an issue anyways, since I'm already using width?) Could anyone help enlighten me on what's going on with this behavior, and if there's a better approach to evenly-divided-yet-dynamically-resizing-width divs than what I've got in 'test2.html'? Thanks. --Mike __ 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/
