Re: [css-d] lines not moving...
On 31.01.2012 23:13, Michael Beaudoin wrote: www.ba-doyn.com/junk/sweep_review If I understood you right, .legalLinks { font-size: 11px; clear: left; padding-left: 82px; } ...seems to work. regards Georg __ css-discuss [css-d@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] Positioning a popup window over the button
On 07.01.2012 15:12, Laura Valentino wrote: I'm trying to position a popup window over a button. I've succeeded in doing that by using position: relative and applying a negative top value. The problem is that it creates a space below the button (I assume the same size as the window) and pushes the footer down below that. What's going on?? http://vidmot.com/popupwindow/ Relative positioning means the space occupied by the element, is taken up in the original - non-offset - position. One solution is to add ' margin-bottom: -460px;' to div id='PopUp' - (height + padding + border-width), so it doesn't take up any space in original position. regards Georg __ css-discuss [css-d@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] Nested div pushing outside of parent in IE7
On 08.12.2011 20:16, Jeff Reid wrote: Search box displays results in a div under the search box and works fine in IE8, IE9, FF and Chrome but IE7, it gets pushed outside the parent div. http://v2.clickandimprove.com/default.asp Looks like you're absolute positioning that div in thin air - no top/bottom declared. IE7 and older don't like that, so try declaring an actual position - in which case you can/should of course delete the margin-top. regards Georg __ css-discuss [css-d@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 an image in a sidebar
On 07.12.2011 01:23, Lisa Frost wrote: On this site: http://www.flyingwithdiabetes.com/ the image of the book in the side bar needs to be centered. One way to achieve auto-centering of images... p .bookcover { display: block; margin: 10px auto; position: relative; left: -2px; } ...where the first two lines/declarations centers the image, by turning it into a block-element which will take margins on all sides. The two last lines/declarations offset the image a couple of pixels so it looks centered in the sidebar even though left and right margin on the paragraph containing the image do not have the same value. Adjust this offset to taste. regards Georg __ css-discuss [css-d@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] can't get margin-bottom on p to take effect
On 10.11.2011 19:35, Angela French wrote: ...there must be something I'm not understanding about margin-bottom on block elements. Study: http://www.w3.org/TR/CSS2/box.html#collapsing-margins ...and add one of the property values that will prevent the effect of collapsing margins. regards Georg __ css-discuss [css-d@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] css measures - em grid system makes sense ?
On 09.11.2011 19:51, mem wrote: Question A) What unit should we use ? I've seen on some sites the option for max-width: 100% I've seen max-width defined with: em; I've seen it with px; To make a flexible layout play well across the increasing spread of large and small screens/devices, I often start out with the following mix for main container... width: 99%; min-width: 560px; max-width: 76em; ...which makes reasonably good use of available window-width without becoming too wide or too narrow. Modifying these values along with other layout details at both ends and at certain intermediate window-widths for capable browsers in a small number of mediaqueries, for improved results. Question B) If we do so on the container wouldn't we end up with some overlapping things on a certain zoom in scale ? If so, how would we avoid it ? - Will we avoid it by dropping this idea of making margins and paddings with EM and use % instead ? Zooming should not cause overlapping - unless one plays too much with absolute positioning and other techniques with similar effects in a layout. I prefer side-margins in % for optimal use of available window-width though. regards Georg __ css-discuss [css-d@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] css measures - em grid system makes sense ?
On 09.11.2011 22:24, mem wrote: it will assume the max-width value as width correct ? Yes, but I advice against relying on default behavior across browser-land - especially for legacy browsers - when adding 'width: 100%' (or something) costs so little. If so, how can I declare those base 60em as stated on a) ? If the layout permits you can declare 'max-width: __px' on one container and 'max-width: __em' on another. If those containers have 'width: 100%' declared they can be styled to interact in perfect harmony with min/max-width declared with different units. Remember also that 'body' is just another container in standard-based web design, so the number of containers in a layout can be kept relatively small without loosing styling-flexibility. regards Georg __ css-discuss [css-d@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] css measures - em grid system makes sense ?
On 10.11.2011 02:23, mem wrote: Ok. And why will I need one in px and another in em ? I'm not getting what will that do, should that have the same measures like: 960px and 60em ? 60em may be somewhat equal to 960px under certain, very limited, conditions. If you're happy with that there's no need to mess with both units, just make up your mind whether it's 'em' or 'px' or some other unit you're gonna rely on ... and test well. Great recall. I presume that body will have some sort of background image so I cannot narrow it, and it should be as wide as the viewport unfortunately. If you say so. I often let 'html' alone do the fill viewport job, leaving 'body' open for other jobs. How to use elements depends mainly on degree of legacy browser support. So this means adding and extra container with no semantic propose other then dealing with this ? Probably not necessary to add any non-semantic elements as style only hooks, _if_ you've got a good set/use of semantic elements in the layout. You'll have to present it - with the semantics - if you want really qualified and detailed advices on how to style it to your liking. regards Georg __ css-discuss [css-d@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] redmond 6/7
Confirmation of correction/addition appreciated. http://chelseacreekstudio.com/site/css/sisu.css Header-balance in IE6/7 is close enough now - on default font-size. No horizontal scrollbar below min-width in IE7/8. Use of 'overflow: hidden' on body prevents 'min-width' from being useful. Georg __ css-discuss [css-d@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] redmond 6/7
On 22.10.2011 04:00, David Laakso wrote: Fast and dirty quick check ie 6/7 [sig link] appreciated. Thanks. Best, Qzzie. Less height on header in IE6/7 - balls crossed by line instead of riding just above it. No big deal IMO. I suggest setting 'min-width' at 480 (or maybe a bit higher) for IE7/8 and other browsers that can't transform to single-column - don't support mediaquery. Georg __ css-discuss [css-d@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] DIV behind floating element
On 17.10.2011 09:40, Ghodmode wrote: I've discovered that setting overflow:auto on div.banner fixes the problem, but I don't know why. This 6 year old page illustrates how block formatting triggered by overflow: hidden/auto works... http://www.gunlaug.no/contents/wd_example_01_02.html regards Georg __ css-discuss [css-d@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] question re: vertical alignment of floated divs
On 15.10.2011 18:06, Bill Walton wrote: I would like to have a container div that allows the number of fixed-size divs on each 'row' inside it grow or shrink based on available space. The need to put these negative margins on the inside fixed-size divs seems to preclude that. Is this just the nature of floats? No, it is not. Floats floated next to each other will naturally align vertically to the same line - no corrective top-margins needed. Unless you have made a coding-error something must be pushing down across the top of the container. Can't dissect your case based only on your description, but you should try floating the container div too as that will make it _contain_ its floated children and prevent the effect of collapsing margins on elements outside the container div from affecting elements inside it. Report back about the result, so we at least can figure out if we need to see your entire code or not. regards Georg __ css-discuss [css-d@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] Menu: where to place in markup?
On 10.10.2011 18:06, John wrote: Link: http://www.coffeeonmars.com/testing/index.html You have a missing ' ' in there... div id=SideMenuContainer_Home ...which means that ID can't be targeted from CSS in most browsers. Apart from that, if you want to float the menu-elements all the way up on the left side, you will have to float the content to the right. Something like this will do... #content { color: #111311; width: 727px; float: right; margin-right: 150px; } regards Georg __ css-discuss [css-d@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] Expression hack for IE quirk?
On 07.10.2011 17:56, Keith Purtell wrote: I'm curious as to what some of you may think of this method I saw for handling IE's refusal to recognize max/min-width? I had never heard of an expression hack. I have used, and still use, expressions for on sites that should/must provide maximum support for IE6. See... http://www.gunlaug.no/contents/wd_additions_14.html As you can see I combine min/max in one expression, and check/modify expression depending on what mode IE6 is in. regards Georg __ css-discuss [css-d@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] Having a hard time getting footer to work
On 29.09.2011 00:50, Emeka wrote: This is my first real attempt at trying out CSS, so I would want someone to go through my below style and comment or review. Don't know what you are trying to achieve with the footer, but the HTML code needs a standards mode trigger (a doctype) and validation. No use mixing float and absolute positioning on same elements. An A:P element can _not_ float. Also, there is no way to clear an absolute positioned element, so the footer can't clear those 3 columns. As for a working starting-point, here is your page with all nonsensical CSS properties/values commented out and a few properties/values added. Nothing special - just enough to make it work across browser-land... http://www.gunlaug.no/tos/alien/eme/emeka_1.htm CSS is in the page-head, where the link to the stylesheet should also be in a finished page. regards Georg __ css-discuss [css-d@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 6/7 ::
IE6/7 cutting off lower part of J in vertical Journal. Haven't found any other major show-stoppers so far - will look deeper later. Georg __ css-discuss [css-d@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] CSS Content
On 22.09.2011 16:38, Giles, Sarah wrote: I want to add an img before adiv tag using CSS content. Is this possible? Yes, no problem. Example-page: http://www.gunlaug.com/index.html ...where I use the following site-wide styles to insert 3 birds, an (R) and a (C) in the header-area, and a cat at the cross-point between right column and footer. All images absolute positioned relative to their containers, and all discretely injected as page-decoration :-) #nav:before {content: url(../imagedepot/burp-1.png); position: absolute; top: -60px; right: 13%; width: 150px;} #base:after {content: url(../imagedepot/op-peregrine.png); position: absolute; top: 54px; right: 8px;} #sec:before {content: url(../imagedepot/op-peregrine-1.png); position: absolute; top: -60px; left: -10%;} #base:before {content: url(../imagedepot/op-kestrel-1.png); position: absolute; top: -3px; right: 12%;} #main:before {content: url(../imagedepot/cr20.png); position: absolute; top: 103px; right: 3px;} #main:after {content: url(../imagedepot/rg20.png); position: absolute; top: 3px; left:330px;} I have used the old form with : (not ::) to make it work in as old browsers as possible, and even older browsers that don't support either form just don't present the decoration. regards Georg __ css-discuss [css-d@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] CSS Content
On 22.09.2011 22:01, G.Sørtun wrote: Example-page: http://www.gunlaug.com/index.html Note that I have wrapped the before: and after: styles in a ... @media screen {} ...where I initially set all before: and after: to display: none to hide these styles from a few semi-old browsers that support before: and after: but don't position CSS content properly. I then re-set these particular styles to display: block in a... @media screen and (min-width: 0) {} ...since I have found through testing that browsers that support that particular mediaquery also do an acceptable job on positioning CSS content. It is all in the CSS support and sequence, and mine is just one way to achieve the intended hide and seek for generated content across browsers and browser-versions. regards Georg __ css-discuss [css-d@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] CSS Content
On 22.09.2011 22:14, Giles, Sarah wrote: This is what I went with: [.] Should work OK, although I would normally define position: absolute on the generated content and position: relative on the .featured_offer container or one of its parents. Find positioning to be more flexible that way, but such flexibility is of course not always needed. regards Georg __ css-discuss [css-d@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] Drop Down Menu On Hover Testing Please - IE 7
On 12.09.2011 05:45, Elli Vizcaino wrote: I would greatly appreciate it, if a number of you would take a look at this site http://e7flux.com/dfd/ and hover on the word About in the nav. In IE7 the dropdown hangs (stays open) if mouse-pointer is moved anyway but straight upwards, and as the image... http://www.gunlaug.no/tos/alien/ev/ev-ie7.png ...shows the list-items in the dropdown don't line up properly in IE7. All other (newer) browsers get that right. In most other browsers at my end the last list-item in the dropdown is missing because dropdown-container doesn't adjust in height when I apply a minimal but necessary resizing of the smaller font-size. regards Georg __ css-discuss [css-d@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 6/7/8
On 12.09.2011 17:17, David Laakso wrote: http://chelseacreekstudio.com/ IE6 drops left column, turning the layout into a centered single-column. IE7/8 are doing fine. Georg __ css-discuss [css-d@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] Drop Down Menu On Hover Testing Please - IE 7
On 12.09.2011 15:46, Elli Vizcaino wrote: Do you think the reason it hangs is because I didn't set a width on the ul of the submenu? How can I resolved this? Not sure ... been a long time since I bothered about IE7. Others will chime in. I set the current height to min-height: 136px and added height: auto - can you tell me if this resolves the minimal font resizing issue you had? No, it does not fix the issue - last list-item is not visible in my browsers. Seamonkey? Umm that doesn't sound like a very popular browser. Seamonkey is the Mozilla-suite for those (of us) who don't think Firefox has enough built-in functionality. Seamonkey comes on all OS'es, with upgrades a little after those for Firefox since they (as browsers) are built on the same base-code. So, Seamonkey's popularity should not be an issue... Firefox and Seamonkey show the same flaw in your dropdown - last list-item is not visible, with 'minimum font size set' at 14px. regards Georg __ css-discuss [css-d@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] Drop Down Menu On Hover Testing Please - IE 7
On 12.09.2011 18:10, G.Sørtun wrote: No, it does not fix the issue - last list-item is not visible in my browsers. Correction: last list-item overflows the dropdown background, making it practically invisible on top of the picture below. If you want to solve that you have to let the dropdown's background stretch with its container. regards Georg __ css-discuss [css-d@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 6/7/8
On 12.09.2011 19:28, David Laakso wrote: http://chelseacreekstudio.com/ Smacks self! Now attempting delivering of a 2 col fixed width layout to IE/6. Confirmation appreciated. Glad to confirm that an OK fixed width 2 column layout now appears in IE6 :-) Georg __ css-discuss [css-d@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] :: media queries ::
On 13.09.2011 03:52, David Laakso wrote: http://chelseacreekstudio.com/ Your comments and suggestion /on this revision/ are welcome and appreciated. Thanks, Milagros Sanchez Looks and behaves reasonably well over a window-width range from 120 to 2400 and with 'minimum font size' ranging from 9 to 32 - larger font sizes are of course only good on not too small windows. Present design-revision should definitely cover some ground and devices. Surprisingly (given the general state of the web), some of the content even makes sense... :-) Georg Weeki Wachee, FL __ css-discuss [css-d@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 7 DROP DOWN MENU HANG CHECK PLEASE
On 13.09.2011 04:43, Elli Vizcaino wrote: I found this on a possible fix: http://www.builtfromsource.com/2006/10/23/a-fix-for-suckerfish-dropdowns-in-ie-7/ - I added #main-nav li.about:hover { position: static;} Can someone please confirm that this works in IE7 and the sub menu NO longer hangs or freezes. http://e7flux.com/dfd/index.html Works fine in IE7 at my end. regards Georg __ css-discuss [css-d@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] :: media queries ::
On 02.09.2011 14:31, David Laakso wrote: Her header stuff is kinda jumpy on a drag from a full-window to a 400px mobile-window. Suggestions for correction? markup http://chelseacreekstudio.com/ Hmmm ... maybe you should try _not_ to control layout in so much details over that wide a range - use fewer media queries for instance..? Also, although I can imagine people with a particular interest in web design may like to drag window-width up and down just to see what happens to a particular layout, most normal end-users don't. Georg __ css-discuss [css-d@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] two similar pages; one scrolls. Why?
On 27.08.2011 01:37, John wrote: [...] I am not sure where, but somebody said that position: was the way to go... Position is fine ... once you master the various variants and all combinations. one of these days, I will know what I'm doing with this stuff... I am sure you will. Until then, and maybe even after, try adding a test-style like the following while designing... * {outline:red solid 1px;} ...so you know what space the various elements occupy. Much easier to tune any layout then, and the test-style is easy to find and remove once you are happy with your design. regards Georg __ css-discuss [css-d@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] why does clear:both not work on this div?
On 22.08.2011 06:57, Lisa Frost wrote: The green bar (mainMenu) should be below the white menu (topMenu)in this design: http://www.mycfoasia.com/dev/ css:http://www.mycfoasia.com/dev/css/mycfo_mainstyles.css I thought putting a clear:both on #topmenu would work: Put 'clear: both' on mainMenu instead, and it will work as you intend. regards Georg __ css-discuss [css-d@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] Vertical centering? And another problem.
On 12.08.2011 14:52, Peter H. wrote: in case this is of any help: the only way I've ever found to reliably centre vertically, is to use a good old-fashioned table. CSS table is better - unless one has to support old-fashioned browsers with limited CSS support. Georg __ css-discuss [css-d@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] IE7 absolute position hasLayout issue
On 29.07.2011 17:05, Angela Jordan wrote: I'm pretty sure this is a hasLayout issue since it appears in IE7 and no other browsers I've looked at (not testing for IE6), but I've tried half a dozen fixes to no avail. http://mobilebotanicalgardens.org/wordpress/ IE7, and older, tend to mess up if you put an absolute position element directly after a float in source-code. As for fixes... #container { width:999px; float:left;-- delete. } ...will work. Putting a dummy-element between the float and AP elements will also work... /div!-- #container -- div/div div id=primary class=aside main-aside regards Georg __ css-discuss [css-d@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] Float Issue with IE7 (and IE6)
On 28.07.2011 00:47, Debbie Roes wrote: The issue I'm having has to do with float drop in IE7 and IE6 in the header area of the site. http://bernofinmgt.com/revised/ IE6/7 don't interpret align=left on logo in your favor. The addition of... #header .row-1 a img {float: left;} #header .row-1 div a img {float: none;} ...will float the logo as pr CSS specs, and be interpreted correctly by IE6/7. regards Georg __ css-discuss [css-d@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] question on space at bottom of page
On 23.07.2011 00:28, Gail Issen wrote: html { overflow-y : scroll; } While David's solution does work, it causes a validation error. Wrong. It validates as CSS 3 - not CSS 2.1. Georg __ css-discuss [css-d@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] question on space at bottom of page
On 23.07.2011 01:03, Gail Issen wrote: Can you direct me to a site where I can check for CSS3 validation? http://jigsaw.w3.org/css-validator/ Select More Options Profile : CSS level 3. Georg __ css-discuss [css-d@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] 100% height issue, and graphic placement q's
On 21.07.2011 20:30, John wrote: Well, I am getting closer to tackling this issue, yet my playing with values in the below body:after code didn't fix the issue which can be seen in the screengrab here: http://www.coffeeonmars.com/afterResults.jpg Have more or less lost track of what you're trying to achieve, but maybe this is close enough... http://www.gunlaug.no/tos/alien/j/john.html http://www.gunlaug.no/tos/alien/j/john_files/styles00.css regards Georg __ css-discuss [css-d@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] 100% height issue, and graphic placement q's
On 21.07.2011 22:15, John wrote: what I need to do is make the center, darker area visually go the the bottom of the browser window no matter how short or tall it is, I see. Reload... http://www.gunlaug.no/tos/alien/j/john.html http://www.gunlaug.no/tos/alien/j/john_files/styles00.css ...and see if it is OK with 'height: 100%' strategically added. Georg __ css-discuss [css-d@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] 100% height issue, and graphic placement q's
You're mixing floats and absolute positioning on major element, which can't work in such a layout. The mix of 'em' and 'px' for margins and width also doesn't work well in such layouts. So, reload again... http://www.gunlaug.no/tos/alien/j/john.html http://www.gunlaug.no/tos/alien/j/john_files/styles00.css ...and test with the basic fixes for those flaws in place. Georg __ css-discuss [css-d@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] Issue with background images on small devices
On 20.06.2011 11:00, Göldi wrote: Heres the site: http://www.goeldi.eu/abusart/ Can anybody tell me the reason and how to avoid this behaviour? Reason: the various, stacked, elements don't relate to each other, and therefore don't adjust dimensions to each other. Natural fallback is body-width in browser-window, which causes the effect you're seeing with the element holding the background not being wider than the browser-window. For that specific case/page you may get away with setting a specific width on relevant elements, for instance... #wraponcircle, #wrap {1130px;} ...but it would all be so much easier if you avoided reliance on absolute positioning and made sure all containers actually contained their intended content. regards Georg __ css-discuss [css-d@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] IE7 Position Fixed Problem
On 12.06.2011 14:21, John Franks wrote: http://www.thesussexbookkeeper.co.uk In IE7, with position:fixed applied the header_div flies off to the right. Add... #header_div {top: 0; left: 0; } ...to let IE7 know where to fix it. regards Georg __ css-discuss [css-d@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] Making A Link Disappear When Revisited By A Reader
On 10.06.2011 20:27, Fabienne wrote: So I want the link to the ending they did not choose disappear after they make their choice. You can use relative or absolute positioned links, and modify position and z-index to layer the visited link on top of the non-visited link. That way only the chosen link will be visible and available. regards Georg __ css-discuss [css-d@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] os x 10.4 opera/11.1
On 13.05.2011 11:08, Philippe Wittenbergh wrote: The only solution I see is moving the jquery call to the head of the document. Yes, it looks like that is the only reliable solution. Georg __ css-discuss [css-d@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] os x 10.4 opera/11.1
http://www.chelseacreekstudio.com/m/mhr/page/02.php Have no idea, but... body {overflow: hidden;} ...works. Georg __ css-discuss [css-d@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] :: makeready ::
Your comments and suggestions are always appreciated. uri: http://chelseacreekstudio.com/ Expanded 'pane' is stacked higher than fixed 'nav', thus covers it when expanded on short windows. Setting 'z-index: 2' on 'nav' should fix that minor flaw, but I haven't tested. regards Georg __ css-discuss [css-d@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] Incorrect width - Opera Bug?
On 27.04.2011 05:17, Philippe Wittenbergh wrote: http://dev.l-c-n.com/CSS3/transform_scale_min-font-size.html I have a minimum font-size set to 12px in all browsers, in Opera 11.10, Gecko 1.9.2 and Safari 5 / WebKit / Chrome, the text in the lower box is half that size. Interesting. Gets scaled up by the 'minimum font size: 14px' I use, with result as expected. Another trap for unsuspecting designers as browser extensions and good old end-user stylesheets catch up with misuse. Dunno about IE 9. Nothing yet, AFAICT :-) IE's Ignore font size isn't the same as minimum font size though, so it will be interesting to see how IE will handle transform. regards Georg __ css-discuss [css-d@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] Incorrect width - Opera Bug?
On 27.04.2011 11:01, Philippe Wittenbergh wrote: Updated the test case. Reports please ? IE9 transforms, and scale by 16px when using accessibility setting. Georg __ css-discuss [css-d@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] Incorrect width - Opera Bug?
On 26.04.2011 19:22, Chetan Crasta wrote: Does anyone know if this can be overriden? 'Minimum font size' can not be overridden in any browser, so you better find a way to solve your case that doesn't run into it. regards Georg __ css-discuss [css-d@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] Incorrect width - Opera Bug?
On 26.04.2011 19:38, Chetan Crasta wrote I guess I'll have to just tolerate that difference in Opera's rendering. ...and Firefox and Safari, not to mention IE... It is just how those browsers work. Georg __ css-discuss [css-d@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] Can a DIV be made invisible to mouse clicks?
On 24.04.2011 09:36, Martin G wrote: So, in the end, my question is, can I lay one DIV on top of another without having the top div trapping mouse events that I want the DIV underneath to catch? Only if you can stack the various elements that should take mouse events even higher than the overlay - through it sort of. Can't determine if that is possible in your case, without seeing/testing the actual page. regards Georg __ css-discuss [css-d@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] Benefits of resetting all divs to position:relative?
On 21.04.2011 15:09, John Jimenez wrote: Anyone here able to provide some insight on the pros/cons of this seemingly increasingly common reset? Read... http://www.satzansatz.de/cssd/onhavinglayout.html#rp ...and the rest of the article. As a *general* (re)set there is no pros, and more cons than I care to list. As a fix targeting *only real bugs* in the old and outdated IE versions, well-placed R:P is quite useful. Beyond that R:P should be used only if you want to offset an element, stack it out of order, or relate an absolute positioned element to it. regards Georg __ css-discuss [css-d@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] Need advice please
On 20.04.2011 04:18, Kirsten Rourke wrote: http://kirstenrourke.com Lots of proprietary MS code in there, but all that IE-targeting code only seem to work in IE8 - not older and not IE9. So, to me it looks like all that IE code can be deleted, and then you should check up in and tweak for the IE versions you want covered. regards Georg __ css-discuss [css-d@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] How to position a footer below other absolute and relative positioned elements
On 10.04.2011 23:01, Ian Piper wrote: Hi all, I've been away from this list for a long time: hope all are thriving. Sure we are :-) I'd appreciate some advice about positioning. http://monickr.com/ My advice is simple: don't absolute position more than you have to, and avoid absolute-positioning of main parts of pages. A good mix consisting of normal flow with some positioned elements here and there, works better. Example: http://tinyurl.com/6hzeg38 (quickly revised version of your page). regards Georg __ css-discuss [css-d@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] Padded image picks up a:hover background color
On 09.04.2011 06:51, RePost wrote: I thought I could override the default a:hover background color, but it's not happening. Test site is here: http://bit.ly/hLlMwb The simple solution... #socialbar a {background: transparent!important;} ...but while you're at it you may as well put the margin on the link instead of on the image... #socialbar a {background: transparent!important; float: left; margin: 10px 0 0 30px;} #socialbar a img {margin: 0;} ...thus limit the :hover area to the image itself. regards Georg __ css-discuss [css-d@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] CSS Question
On 08.04.2011 08:36, cssl...@bassonhook.com wrote: http://www.freehostbc.com/fnfsportsfishing/galleries/gallery.html The addition of... #nav {position: relative; z-index: 1;} ...will stack nav dropdowns in front of all else in that gallery page. regards Georg __ css-discuss [css-d@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] Is @font-face 'legal'?
On 08.04.2011 09:56, Geoff Lane wrote: I've just ran one of my stylesheets through the W3 validator and was shocked to get 4 errors and one warning returned. Three of the errors relate to an @font-face definition and the warning claims there are no declarations in the @font-face rule. The fourth error claims there is no such thing as 'behavior' AFAICT. Remember to set CSS3 under More options, which will lead to a better result. See: http://tinyurl.com/6hpn2ru There is no such thing as 'behavior' in standardized CSS, it is proprietary Microsoft code. regards Georg __ css-discuss [css-d@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] How to test in many browers
Reality check... On 08.04.2011 02:08, David Hucklesby wrote: - All versions of IE, and all emulation modes act differently The result of IE catching up with the rest ... pretty close now with IE9 - if not challenged too hard. Draw the line at an IE version you, and your clients, are comfortable with, and leave older versions behind - untested and/or ignored. - OS settings such as DPI and Clear Type may affect rendering a lot Uncontrollable from our end, so unless you design in tight corners for a specific set of setting there is nothing to test. If required to design tight, chances are it will look strange at best on a high number of end-user monitors no matter how much testing and correction is done. - Browser settings come in many flavors, with multiple effects - The same browser may act differently in Windows than on a Mac End-user's choice/dilemma ... uncontrollable from our end. If testable: check and make sure stuff stays accessible. Never try to design around or counteract anything, as that will as a rule only make things worse for a higher number of end-users. - There are many OS settings and browser add-ons to aid accessibility Basic OS settings should work reasonably well ... make sure stuff stays accessible. Browser add-ons are entirely the creator's and end-user's responsibility, so nothing to test for. If they work, they work. If not, they better fix it. - Many new computers I have seen come badly adjusted out of the box Uncontrollable and all over the place, so nothing to test for. Badly adjusted /anything/ at the user-end will as a rule affect all web sites to some degree, so just follow the crowd... ... and I have yet to mention non-PC devices! Ain't CSS fun? Yes... ...and I'm still waiting for my fridge to connect... I wait with bated breath for a hail of silver bullets... :) :-) regards Georg __ css-discuss [css-d@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] Weir behaviour with the float attribute
On 03.04.2011 01:28, Matteo Bertamini wrote: Hi everyone! I'm trying to understand the behaviour of this code (and its related css attributes of course): http://dl.dropbox.com/u/1889847/test.html Floats are not supposed to rise higher than preceding floats, so Fx is correct and show the same line-up as other non-IE browsers. OTOH: the document keeps all browsers in quirks mode - no doctype, so IE will not bother with W3C standards but instead fall back to how IE5.5 treats such elements/CSS. If IE quirks mode behavior is what you expect, no wonder you have problems understanding non-IE browsers' much closer to W3C standard behavior even in quirks mode. Only IE really needs a doctype in order to follow W3C standards. regards Georg __ css-discuss [css-d@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] questions about block formatting context
Can someone give an example of a block in a block formatting context establishing a new block and being made more narrow by a float? I'm having a hard time figuring out exactly what they mean by that. http://www.gunlaug.no/contents/wd_example_01_01.html http://www.gunlaug.no/contents/wd_example_01_02.html __ css-discuss [css-d@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] Browser Support: Alternate Style Sheets?
On 28.03.2011 08:54, Jukka K. Korpela wrote: The practical conclusion is that alternate stylesheets are not of much use _unless_ you also create an explicit user interface for selecting one of them and program code for making the selection a preferred stylesheet and for storing this selection so that it works across pages and across sessions. You are correct, of course. Site owners/coders have to know what they want and implement solutions that work, and end users can choose to accept, use or ignore it - and may even stay ignorant about the whole issue. Which, since there is only regular, decade-old technology involved, IMO makes alternate stylesheets as useful or useless as everything beyond the most basic HTML documents. regards Georg __ css-discuss [css-d@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] overlay link
On 28.03.2011 15:04, Sara Haradhvala wrote: I have a block of content, and I'd like to overlay a transparent link on top of the whole block -- where the link is active both on top of the text and in the margins. Sounds ugly, and difficult to debug without a direct link. Nevertheless, the old hack for IE was to link in a non-existing background image to trick that browser into covering everything with the overlayed link. Don't know if that will work in your case in whatever IE versions you have problems with. regards Georg __ css-discuss [css-d@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] Browser Support: Alternate Style Sheets?
Support for alternate stylesheets isn't a problem. See, and test on... http://www.howtocreate.co.uk/userStyle.html How useful alternate stylesheets are varies from site to site, and from visitor to visitor. regards Georg __ css-discuss [css-d@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] height and width specifications
Is there any reason to specify an image's height and width on the img tag rather than (or in addition to) specifying in the CSS? Setting and image's width and height in the HTML code, reserves the space for that element before image gets loaded. I don't think there is any other advantage, and I rarely ever set image width/height in the HTML code. I don't set images' width/height in CSS either, other than as general and standard-classes for max-width to make images play nice with my layouts. Could specifying the width and height only in the CSS be a reason that an image might load more slowly (in modern browsers)? If one specify varying dimensions for loads of images in CSS everything may slow down somewhat simply because of large CSS. I haven't notices such slow-down for my own work since I don't set dimensions anywhere. Have an example? regards Georg __ css-discuss [css-d@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] change in height of navigation bar
I'm a newbie to CSS, what are the Meyer reset values? Are they a set of steps I can go through. Sort of, but the essence is: *don't expect various browsers to agree on anything, so set all properties/values you need even if one or more browsers seem to do just fine without them.* I certainly need to learn more about browser bugs. With your height of navigation bar problem you are running into _normal behavior_ in browsers, so don't make the mistake of looking for bugs whenever some browser doesn't do exactly what you expect. You will run into plenty of real browser-bugs later on, but it is wisely to take a step back and look for *designer-bugs* before trying to debug browsers. regards Georg __ css-discuss [css-d@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 Background Position
On 18.03.2011 06:05, Kevin A. Cameron wrote: Can someone explain why the background image of the right button is not showing correctly in certain versions of IE? http://www.kacevisual.com/files/Anime-Planet/drafts/lovehate/lovehate.html For that page all IE versions are in quirks mode, and have the same missing right bg-image. Trigger standards mode first, and then test. regards Georg __ css-discuss [css-d@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] List item numbers not printing in Ordered List (correction)
On 03.03.2011 17:47, Tim Dawson wrote: http://holidaymullandiona.com/quest/index.php?next=challenges Perhaps I've missed something obvious ? Can't see any colors defined for print in your styles, and the validator reports one color-value as being non-valid. Check up on, and declare, colors and backgrounds for each media first. regards Georg __ css-discuss [css-d@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] need a 'stronger' hasLayout for troublesome RTL text in IE7
Any previous experience? Plenty... :-) Need to study the actual page. regards Georg __ css-discuss [css-d@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] Flexible parent container height?
How can I get the height of a parent container to re-size according to any nested container(s) content similar to the way tables work? Here's a sample page that demonstrates the issue: http://www.mdsol.com/conferences/mug2/amug.html For your example you don't need table behavior. Declaring 'overflow: hidden' on the parent container and avoid setting a height on it, will make it expand in height to contain all its children. Apart from that: CSS tables work the way HTML tables work - in all the latest browser-versions. Here 4 non-table equal height column methods are linked to, in addition to CSS table being described and demo'ed... http://www.gunlaug.no/contents/wd_additions_22.html ...with workarounds for old IE6/7 included for good measure. regards Georg __ css-discuss [css-d@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] three problems with my CSS code
On 21.02.2011 00:45, Zachary Uram wrote: [...] http://yoda.oggthebase.org/css2/index2.html Not sure, but see if this is somewhat like you want that thing to look/behave... http://tinyurl.com/62fuyvf regards Georg __ css-discuss [css-d@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] Couple of newbie CSS questions....
[...] in reference to the following: http://www.douglasniven.com/test.html Best Practice styles are in the page-head... http://www.gunlaug.no/tos/alien/dn/dn-test-110216.htm ...but for short: it is nearly always best to move the image around and make it create its own space by applying suitable margins on it. regards Georg __ css-discuss [css-d@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] Footer too high in IE7
On 16.02.2011 00:57, Dermot Ward wrote: Can anyone please tell me why the footer on this testing page :- http://www.arealnicesite.com is too high in IE7? IE7 (and IE6) expands div#footer to contain floats. Delete the 'width: 1092px;' you have declared on div#footer, and IE7 will render as you want. See: http://www.satzansatz.de/cssd/onhavinglayout.html for why IE7 behaves this way. regards Georg __ css-discuss [css-d@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] major FF4 layout problem
The site's homepage is here: http://bit.ly/h5D9ez The issue is that all of the content under the logo, from the main nav downward, gets pushed way down on the page, so far that you don't even see it without scrolling down. This is on all pages. Any clue as to why this is happening? Can't check up on Mac and on windows it's OK. Might be a good idea to take the problem up here... http://input.mozilla.com/en-US/beta/feedback ...so we don't start hacking a beta-version. regards Georg __ css-discuss [css-d@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] New to the list and a question..
I've been designing/developing web sites since 1996 or so, so I've made my fair share of mistakes :-) Welcome to the club... :-) http://new.thetoyz.com/ Make the right end of the 'graphics/thetoyz_logo.jpg' image sooo much longer - 500-1000 px or something - and style it: float: left; margin-right: -___px; ('___' being the added length of that image, and notice the - minus-sign before that value.) That will make the image stretch past the table-cell and under the navigation-cell and bridge the gap. And fix what you can of the non-valid code, when you get around to it ;-) regards Georg __ css-discuss [css-d@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] New to the list and a question..
On 11.02.2011 23:18, James Sheffer wrote: George- Actually, the image thetoyz_logo.jpg is just the part up to the shop link. The rest of the image is actually a background image that is repeated (a 5px wide image of only the blue bar). On top of that background image are the text links and the separator 2px vertical images. I know what that image is, as I always download and test out my advices/solutions on the OP's page(s) before posting. Just give the image a 500 px white-space (extra width) on the right side and repeat the last 10px fifty times onto that white space. That image will act as a background behind the navigation when floated and pulled in by 500px at the right end, since floats with negative back-side margins don't push table-cells. Perfect alignment and gap-closing is guaranteed in IE6 upwards - until those extra 500px are used up. It's a 10 year old trick that I use all the time, but not in table-layouts... :-) regards Georg __ css-discuss [css-d@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-face syntax revisited
On 12.02.2011 08:15, Philippe Wittenbergh wrote: http://dev.l-c-n.com/_temp/font_eot_woff.html Looks identical in IE9RC, Safari 5.0.3 and Opera 11.01 - on Vista. regards Georg __ css-discuss [css-d@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] Positioning images within a table cell
On 09.02.2011 13:18, Geoff Lane wrote: Any further help gratefully received. Maybe this will do... http://www.gunlaug.no/tos/alien/pb/Map%20Test.htm regards Georg __ css-discuss [css-d@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] Positioning images within a table cell
Georg's solution relied on the table being at the top of the page. To fix it, add a position:relative rule to the table. Then his solution should work beautifully. I tried adding style='position:relative;' to the opening table tag with no discernible effect. Of course it didn't, since those Gecko-browsers won't absolute-position anything relative to a table - not to _any_ part of a table. If you intend to keep the form wrapped around the table like in your example, you can position relative to that form. If not you have to wrap a div around the table and position relative to that div. Updated demo here... http://www.gunlaug.no/tos/alien/pb/Map%20Test.htm ...and the reason it has changed somewhat is because your HTML code were no good - not valid - so *HTML Tidy* cleaned it up a bit. I advice frequent validity checks, or else positioning relative to a table will be the least problem. FYI: Browsers have no built-in understanding of valid when served garbage-code. They just tune it up a bit through garbage-correction filters and render it the best they can with no regard to web standards. The result of such *error-correction* is somewhat unpredictable so don't rely on that any browser actually got it right. regards Georg __ css-discuss [css-d@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] Design question regarding columns and containers
Just so that beginners don't misunderstand, you can keep columns floating side-by-side regardless of window width if you declare a fixed width on the block that contains all the columns. That doesn't strike me as being table emulation, but was that your intention? No Paul, that is not table emulation - that's a regular fixed-width layout with width (in some form) declared on both container and its elements (columns). A table - CSS table or HTML table - expands to contain its children, and the emulations I was thinking of are the solutions we sometimes used to make old IE (7 and older) emulate CSS table. Don't think we need those IE-specific solutions anymore, but they do exist. If I grokked correctly the OP was trying to figure out whether it made sense to only declare width on the elements (column) inside a container, or to declare width on the container and let the width of the elements (columns) relate to the container-width. It ain't that simple... regards Georg __ css-discuss [css-d@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] Design question regarding columns and containers
Now I am wondering from a css standpoint would it be better to craete column divs and their widths dictate width of the containers or just create containers with the correct widths and no column widths (column divs just get used for organization). Setting width on elements (columns) and not on container, usually means the container is meaningless as elements (columns) line up within available space (browser-window) and don't relate to container at all. The container does of course come into play if declared to _contain_ the elements (columns), but only a CSS table construct (or emulation) will make container keep elements (columns) lined up side by side as columns regardless of window-width. You also have to expand on how you intend to set width on elements (columns) and/or container for anyone to be able to supply meaningful suggestions. 1: Is it a fixed (px), fluid (%), elastic (em), conditional elastic (em, %, px) layout or what? 2: Is the layout supposed to live inside a specific or limited-range window-width, or should it adapt to or be rearranged/restyled for a wide window-width range and/or work on various (small, medium, wide) screens/devices? So, more variables than to decide where to declare width must be part of your decision-making process, I'm afraid. regards Georg __ css-discuss [css-d@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] Strange gap...
I'm getting a strange gap to the right of this page: http://fairreview.leeciviccenter.com/special.cfm In what browser do you see strange gaps? Nothing special to report in mine... regards Georg __ css-discuss [css-d@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] Extending a div with background
By nature, the background color on any div will only show for the length of the content. [...] Is there a way around that? Sure, google for 'equal height columns', or start by checking the solutions listed/shown here... http://www.gunlaug.no/contents/wd_additions_22.html regards Georg __ css-discuss [css-d@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] Positioning a float
I need the in-flow, wrapping properties of a float combined with the positioning properties of an absolutely-positioned element. Is anyone aware of a way of achieving that? You may be able to adapt the method shown here... http://www.satzansatz.de/cssd/tmp/floatspacer.html ...for the line-up and appearance you describe: a float positioned at the bottom with text wrapping around it. regards Georg __ css-discuss [css-d@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] dropdown menu bug in IE8
first time I post to this distribution list, so I hope I'm doing it right. Just fine ... Welcome to css-d :-) I have a bug in a dropdown menu in IE8 on this site : http://medisra.sideradesign.com the last items on the dropdown under the second menu item are unattainable as they disappear before they can be clicked. someone suggested it is being forced to IE7 compatibility mode and that's what causing the issue. Yes, document defaults to IE7-standard, so that's how IE8 treats it. Forcing IE8 to treat/render the document in IE8 mode solves the problem with the dropdown. You may add the following meta in page-head and test at your end. meta http-equiv=X-UA-Compatible content=IE=edge / ...will force IE8 to render in optimal (IE8) mode. regards Georg __ css-discuss [css-d@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] Graphic background issue
I'm thinking (accurately or not :) that an 8-bit PNG offers translucency (if that's the right word) if the original file has it. With a smaller file size than 24-bit. Right? Applicable? An 8-bit PNG is somewhat like a refined GIF - transparency is on/off. Example... http://www.gunlaug.no/contents/wd_additions_05.html ...and we are drifting off declared list-topic (CSS) now. regards Georg __ css-discuss [css-d@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] Doubling of an element.
http://theaterbartlesville.com/testing/Live/index.php?p=main Look for this unclosed link... lia class=ho href=index.php?p=mainspanHome/span/li ...or let the W3C markup validator find it for you. regards Georg __ css-discuss [css-d@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] Graphic background issue
I created a graphic in Photoshop,using a transparent background, but when I saved it as a .jpg it now has a white background. I want to display it on a web page. If I save the graphic as a .gif, the edges are gnarly. Suggestions? Save it as 24bit PNG. regards Georg __ css-discuss [css-d@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] how to constrain width of box?
http://mcgivney.ehclients.com/press/ [...] is there some way to always make the box as wide as the photo and not wider? I'd like the caption to wrap around in the box under the photo, but not be wider than the photo. Rearrange source-code and restyle... div class=photo_and_caption span img src=http://mcgivney.ehclients.com/images/channels/press_sample_photo2.jpg; alt=Test Press Event / This is a really long caption that will wrap under the photo and it goes on and on and on /span /div .photo_and_caption span {display: table; width: 100px; text-transform : uppercase; font : 12px 'TitilliumText22LBold', Tahoma, Arial, Helvetica, sans-serif;} ...and you'll get the effect you want in all somewhat decent browsers. regards Georg __ css-discuss [css-d@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] spacing and float problem
[...] Any suggestions on how I can easily achieve this goal? Site Link: http://atcofa.sfasu.edu No easy way I'm afraid, other than to play with element widths and margins. Doing so may lead to something like this... http://www.gunlaug.no/tos/alien/tk/tk.htm ...which may or may not work well enough for comfort at your end. • In that page fixed-width elements are shoehorned into a table, which isn't a good idea. • Stylesheets and inline-styles are competing, which makes modifications hard. • Fixed height on elements containing text certainly isn't a good idea either, as a little font-resizing in browsers will create overflow and destroy everything. Better to make up your mind if you want to use layout-tables or CSS for the entire page, and organize/style it accordingly. regards Georg __ css-discuss [css-d@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] A CSS calendar with an unordered list
I can't test my pages in IE7/6 anymore, since I switched to Win 7 on my Windows PC. http://onwebdev.blogspot.com/2011/01/css-calendar-with-unordered-list.html ps. guess it should work in these browsers... I'm a little bit afraid of positioning. IE7 - working OK. IE6 - no pop-up on hover ... that version needs for something to change on the link itself to rerender on and release the pop-up. IE6 also needs a set width on the pop-up to get it right. My slightly restyled calendar works in IE6 and up... http://www.gunlaug.no/tos/alien/gr/calendar.htm regards Georg __ css-discuss [css-d@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] A CSS calendar with an unordered list
aside I don't quite understand the pop-up. Would a colored or bold-face digit make it more obvious for the naive? Too obvious, jose ;-) If in doubt, hover 4,5,11,2128... Molly 't.c.' __ css-discuss [css-d@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-face, alignment issue similar to images
http://nina.artsassistance.com/ I'm taking the WordPress default theme and mucking it up to the clients wishes with design. In what I hoped would be more browser friendly, I used a ding bats type web font Combi Symbols for a telephone instead of using an image (mostly to satisfy IE6.) Since this is a web font, any thoughts on how I can apply what we would normally do the img {vertical-align: baseline;} to stop drifting upwards? Pretty much the same way as with images - as with all inline elements. Just make sure the line-height is in raw numbers or other non-fixed value there and for other sections (or else IE6 and other IE versions won't do well when font-resizing). Something like... .dingbat {font-size: ___%; vertical-align: -3em;} span class=dingbat☎/span ...will give you optimal control. regards Georg __ 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-face, alignment issue similar to images
On 08.01.2011 10:41, G.Sørtun wrote: .dingbat {font-size: ___%; vertical-align: -3em;} ...should of course be... .dingbat {font-size: ___%; vertical-align: -.3em;} __ 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] Browser hacks vs PHP vs JS for browser detection
Hi people, I just wondered if people had an opinion about the alternative of using hacks/conditional statements, php or js to account for browser variation? My opinion is that browser variations have to be fairly large to bother, but of course: designers often do, so we need methods for making /designers/ happy :-) Targeting browser *versions* to account for minute variations can be a time consuming and never-ending task, as new browser versions add in new variations (of the kind that may throw some designers into a spin) all the time. So better draw a line somewhere in the past - a couple of years back -and leave the new browsers alone - apart from sending bug-reports. In most cases it is browsers variations in, and lack of, support for parts of the CSS we use that cause (mostly visual) variations. So to me it becomes logical to *handle all CSS related variations in CSS*. - Old browser versions are static - nothing changes, so we can target, hack or ignore them at will, as long as we make sure our methods can't affect new browsers - ever. - New browser versions should be given a fair chance to grow, so they should never be version-targeted, hacked or ignored. Instead they should be served the correct styles for what they're supposed to support and act upon, preceded by any intermediate styles we are sure they may respond positively to while waiting for their proper and complete support of the correct styles. Correct styles can be a somewhat moving target if we want to make use of the latest and greatest, so may be a good idea not to throw too much of that into regular production for clients. The latest and greatest is better reserved for personal and/or test sites, while waiting for standards and browsers to stabilize. Note that browsers can spoof or hide User Agent etc., and that this may be done for a lot of reasons not related to your site. So targeting them through browser/version detection is highly unreliable at best. Browsers can not spoof or hide their degree of CSS support - at most support can be turned off or in part overridden by user styles - so all points to that it is always best to *handle all CSS related variations in CSS*. regards Georg __ 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] Absolutely Positioning an object in a div
I have a div with a background image and I am trying to position a flash video in an object tag in that div by applying absolute positioning tho the object tab. It isn't budging. Am I trying to do something impossible? From your description it should be quite possible, but without code/CSS I can't suggest anything to make it work. Can you send a link so we can see what exactly you're trying to do and what your code/CSS look like? regards Georg __ 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] border width?
http://lettershop.ehclients.com/contact/ I'd like the lines/borders to be about as long/wide as the t on real estate, which makes it shorter than that item. Is this possible? No, but you can fake it. The following... #nav li a{ border: none!important /* to override your inline style */; } #nav li{ width: 100px; border-bottom:1px solid #94a1a6; } #nav a{ color:#94a1a6; text-decoration:none; width:120px; display:block; padding:12px 0 17px; margin-right: -40px; position: relative; } ...will make it appear more or less as you outline. regards Georg __ 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] border width?
Are these problems just a matter of correctly targeting the places I want these lines to be? Yes. You take the idea and modifies it along with the rest of your styles until you get the visual appearance you want. Maybe you'll have to move your existing styles around a bit to make it work. Hard for me to do that right from seeing one page. Also, avoid the use of inline-styles whenever/wherever you can, so you don't have to override such styles from the stylesheet. regards Georg __ 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] SVG as background image - and fallback image
Anyone with a cleaner suggestion ? Bonus cookie for the most minimal code possible. Cleaner, no, but the usual nonsense will probably work... http://www.gunlaug.no/contents/styles/target-browser.css (I don't care much for cookies anyway :-) ) Happy New Year (check our latest...) Georg __ 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] Pure CSS tooltips
http://onwebdev.blogspot.com/2010/12/pure-css-tooltips.html the good news is that Opera 10 has fixed its problem with this kind of solution. :-) Make the tooltip's top-position self-adjusting... a.tooltip:hover span { display: block; position: absolute; top: 100%; left: 5px;} ...and not even I will have much problems with it. ;-) regards Georg __ 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] Vendor prefixes and validation
Holiday task for anyone who hasn't done so yet: _read_ the that CSS3 backgrounds and borders module: http://www.w3.org/TR/css3-background/ (or for the latest text, the editor's draft: http://dev.w3.org/csswg/css3-background/) I've put them both under the (palm)tree. Maybe I'll get through them till New Years eve. :-) Georg __ 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] Vendor prefixes and validation
In response to the criticisms moved against my CSS template #1, here's my point of view on that matter: http://onwebdev.blogspot.com/2010/12/css-vendor-prefixes-and-validation.html Never mind the critics regarding CSS validity related to vendor prefixes. History repeats itself, and some simply can't grasp that browser support comes before W3C standards - and in that order. It is a lot worse that you use this old nonsense in the stylesheet... body { font : 62.5% } ...as that small number as base causes seriously over-sized text in a number of browsers with 'minimum font size' set at a reasonable high number (14px in my case) acting on _declared_ font sizes. No new templates should contain that old nonsense, as it almost always causes problems and broken designs for end-users that can't read small text but know how to remedy the problem in their own browser. regards Georg __ 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] Vendor prefixes and validation
No it doesn't and, since only two of the CSS3 specs are currently even at PR state, let alone CR, it would be foolish of them to do so. Hmm, actually, it works the other way round. CSS3 specs don't become fully fledged standards until at least 2 vendors have demonstrated that same specs actually work in browsers. So if no vendor is foolish enough to implement them we won't get those W3C CSS standards anywhere. regards Georg __ 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] Is it because of my code? [correction]
What is your technique for checking this aspect? What I do other than using browswerlab and browswershots, is to change the resolution on my monitor. I also hold down ctrl and +, to enlarge the font to see how it looks. Are these proven methods? New browsers can zoom whole pages, and that's enough to test for regular window-size weaknesses. Most new browsers also have one or more forms of font resizing, and that's usually enough to test for such resizing weaknesses. 1: I always test in the original page-zoom browser, Opera, and also set its 'minimum font size' to '32'. - On my system 'm.f.s = 32' equals 200% of browsers' default font size, which equals WCAG recommendation - as I read it. * 2: I always test in IE 6/7/8, both with regular font resizing and with accessibility font resizing. ** - When I don't have full IE versions available, I use IETester. - Doesn't matter to me whether a site supports older IE versions or not, as testing in them always produces useful information about a site's integrity and design-quality. 3: Brief testing in latest versions of other browsers completes my test-round. Usually nothing to report for sites that survive the above reasonably well. * A large number of web sites fails and become more or less unusable when subjected to 200% of browsers' default font size. Added to and/or included in that number come sites that are not properly cross-browser tested and/or rely on browser peculiarities. ** A large number of web sites fails and become more or less unusable when subjected to accessibility font resizing in IE. Low accessibility awareness is commonplace. regards Georg __ 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/