Re: [css-d] lines not moving...

2012-01-31 Thread G.Sørtun

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

2012-01-07 Thread G.Sørtun

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

2011-12-08 Thread G.Sørtun

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

2011-12-08 Thread G.Sørtun

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

2011-11-10 Thread G.Sørtun

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 ?

2011-11-09 Thread G.Sørtun

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 ?

2011-11-09 Thread G.Sørtun

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 ?

2011-11-09 Thread G.Sørtun

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

2011-10-22 Thread G.Sørtun



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

2011-10-21 Thread G.Sørtun

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

2011-10-18 Thread G.Sørtun

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

2011-10-15 Thread G.Sørtun

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?

2011-10-10 Thread G.Sørtun

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?

2011-10-07 Thread G.Sørtun

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

2011-09-29 Thread G.Sørtun

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 ::

2011-09-29 Thread G.Sørtun

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

2011-09-22 Thread G.Sørtun

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

2011-09-22 Thread G.Sørtun

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

2011-09-22 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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 ::

2011-09-12 Thread G.Sørtun

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

2011-09-12 Thread G.Sørtun

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 ::

2011-09-02 Thread G.Sørtun

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?

2011-08-26 Thread G.Sørtun

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?

2011-08-21 Thread G.Sørtun

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.

2011-08-12 Thread G.Sørtun

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

2011-07-29 Thread G.Sørtun

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)

2011-07-27 Thread G.Sørtun

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

2011-07-22 Thread G.Sørtun

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

2011-07-22 Thread G.Sørtun

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

2011-07-21 Thread G.Sørtun

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

2011-07-21 Thread G.Sørtun

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

2011-07-21 Thread G.Sørtun
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

2011-06-20 Thread G.Sørtun

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

2011-06-12 Thread G.Sørtun

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

2011-06-10 Thread G.Sørtun

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

2011-05-13 Thread G.Sørtun

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

2011-05-12 Thread G.Sørtun

 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 ::

2011-05-03 Thread G.Sørtun

 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?

2011-04-27 Thread G.Sørtun

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?

2011-04-27 Thread G.Sørtun

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?

2011-04-26 Thread G.Sørtun

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?

2011-04-26 Thread G.Sørtun

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?

2011-04-24 Thread G.Sørtun

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?

2011-04-21 Thread G.Sørtun

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

2011-04-19 Thread G.Sørtun

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

2011-04-11 Thread G.Sørtun

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

2011-04-09 Thread G.Sørtun

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

2011-04-08 Thread G.Sørtun

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'?

2011-04-08 Thread G.Sørtun

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

2011-04-07 Thread G.Sørtun

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

2011-04-02 Thread G.Sørtun

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

2011-04-01 Thread G.Sørtun



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?

2011-03-28 Thread G.Sørtun

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

2011-03-28 Thread G.Sørtun

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?

2011-03-27 Thread G.Sørtun

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

2011-03-24 Thread G.Sørtun

 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

2011-03-22 Thread G.Sørtun

 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

2011-03-18 Thread G.Sørtun

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)

2011-03-03 Thread G.Sørtun

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

2011-03-01 Thread G.Sørtun

 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?

2011-02-22 Thread G.Sørtun

 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

2011-02-20 Thread G.Sørtun

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....

2011-02-16 Thread G.Sørtun

 [...] 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

2011-02-15 Thread G.Sørtun

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

2011-02-14 Thread G.Sørtun



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..

2011-02-11 Thread G.Sørtun



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..

2011-02-11 Thread G.Sørtun

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

2011-02-11 Thread G.Sørtun

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

2011-02-09 Thread G.Sørtun

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

2011-02-09 Thread G.Sørtun

 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

2011-02-08 Thread G.Sørtun

 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

2011-02-07 Thread G.Sørtun



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...

2011-02-01 Thread G.Sørtun


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

2011-01-29 Thread G.Sørtun



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

2011-01-27 Thread G.Sørtun



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

2011-01-26 Thread G.Sørtun


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

2011-01-24 Thread G.Sørtun


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.

2011-01-24 Thread G.Sørtun



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

2011-01-23 Thread G.Sørtun



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?

2011-01-20 Thread G.Sørtun



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

2011-01-17 Thread G.Sørtun



[...] 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

2011-01-16 Thread G.Sørtun


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

2011-01-16 Thread G.Sørtun



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

2011-01-08 Thread G.Sørtun



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

2011-01-08 Thread G.Sørtun

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

2011-01-06 Thread G.Sørtun

 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

2011-01-06 Thread G.Sørtun


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?

2011-01-03 Thread G.Sørtun

 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?

2011-01-03 Thread G.Sørtun

 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

2010-12-28 Thread G.Sørtun



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

2010-12-24 Thread G.Sørtun



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

2010-12-22 Thread G.Sørtun



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

2010-12-20 Thread G.Sørtun


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

2010-12-20 Thread G.Sørtun


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]

2010-12-18 Thread G.Sørtun



 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/


  1   2   >