Re: [css-d] padding-left mysteriously vanishes from list object
On Tue, 21 Oct 2008 11:05:14 -0400, Sandy wrote:
[...]
I am working on a little site that has a 2 row menu which needs to appear as
a box,
with the second row the same width as the first. This is working fine in
everything but
IE, which is not displaying the padding-left on the first box in the second
row, for
some mysterious reason. The text in that box appears flush with the left of
the box.
Here is the little site:
http://sandyfeldman.com/ondemande/bref.html
Here is the style sheet:
http://sandyfeldman.com/ondemande/css/ondemande.css
Try adding float: left; to the rule for .menu li.
Also, check your pages in Opera 9.6 (problem with header) and any browser
that resizes text - the design is rather fragile. I suggest using some em
sizes in place of pixels for some of the problem widths.
Cordially,
David
--
David, I am *very* grateful to you for taking the time to look at this
for me. I was COMPLETELY flummoxed!
The change you suggested cleared up my IE6 7 problems
http://sandyfeldman.com/ondemande/bref.html
I added an em size for the #ondemande span, and now it screws up in
Opera in a slightly less stupid looking way than before.
#ondemande {
width : 10em;
float : left;
background-color : #fff;
}
I put the logo in a span and added a width to that, but the right side
of the banner is wrapping.
Any thoughts?
Sandy
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding-left mysteriously vanishes from list object
Sandy wrote:
http://sandyfeldman.com/ondemande/bref.html
I added an em size for the #ondemande span, and now it screws up in
Opera in a slightly less stupid looking way than before.
I put the logo in a span and added a width to that, but the right
side of the banner is wrapping.
Take that extra span out - it doesn't do any good.
Also: clean out the end tag for element a which is not open that
the HTML validator complains about. Maybe you want an anchor around the
logo, but in that case the a start tag is missing.
The reason Opera kicks down the #ondemande span is that #skip takes up
space. Opera comes with a 'minimum font size' default set that is 9 to
11px depending on OS, so your...
#skip {
font-size : 1px;
...fails. That trick also fails in all other browsers that have similar
'minimum font size' options at my end. I set that option to 14px, so
Firefox and Safari do the same as Opera.
IE/win does the same when set to ignore font sizes in pages.
To fix that line-up, simply pull in the backside on the floating #skip,
by adding...
#skip {margin-right: -1000px;}
...which makes #skip take up zero space.
Here's an illustration on how margins on floats work...
http://www.gunlaug.no/tos/moa_16.html
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding-left mysteriously vanishes from list object
Gunlaug Sørtun wrote:
Sandy wrote:
http://sandyfeldman.com/ondemande/bref.html
I added an em size for the #ondemande span, and now it screws up in
Opera in a slightly less stupid looking way than before.
I put the logo in a span and added a width to that, but the right side
of the banner is wrapping.
Take that extra span out - it doesn't do any good.
Also: clean out the end tag for element a which is not open that
the HTML validator complains about. Maybe you want an anchor around the
logo, but in that case the a start tag is missing.
The reason Opera kicks down the #ondemande span is that #skip takes up
space. Opera comes with a 'minimum font size' default set that is 9 to
11px depending on OS, so your...
#skip {
font-size : 1px;
...fails. That trick also fails in all other browsers that have similar
'minimum font size' options at my end. I set that option to 14px, so
Firefox and Safari do the same as Opera.
IE/win does the same when set to ignore font sizes in pages.
To fix that line-up, simply pull in the backside on the floating #skip,
by adding...
#skip {margin-right: -1000px;}
...which makes #skip take up zero space.
Here's an illustration on how margins on floats work...
http://www.gunlaug.no/tos/moa_16.html
regards
Georg
Georg - thanks SO much. Opera is working!
I really appreciate having help with this.
best regards,
Sandy
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding-left mysteriously vanishes from list object
On Tue, 21 Oct 2008 11:05:14 -0400, Sandy wrote: [...] I am working on a little site that has a 2 row menu which needs to appear as a box, with the second row the same width as the first. This is working fine in everything but IE, which is not displaying the padding-left on the first box in the second row, for some mysterious reason. The text in that box appears flush with the left of the box. Here is the little site: http://sandyfeldman.com/ondemande/bref.html Here is the style sheet: http://sandyfeldman.com/ondemande/css/ondemande.css Try adding float: left; to the rule for .menu li. Also, check your pages in Opera 9.6 (problem with header) and any browser that resizes text - the design is rather fragile. I suggest using some em sizes in place of pixels for some of the problem widths. Cordially, David -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] padding-left mysteriously vanishes from list object
Hey all, I have a problem that has me flummoxed, and I hope someone out there can help. I am working on a little site that has a 2 row menu which needs to appear as a box, with the second row the same width as the first. This is working fine in everything but IE, which is not displaying the padding-left on the first box in the second row, for some mysterious reason. The text in that box appears flush with the left of the box. Here is the little site: http://sandyfeldman.com/ondemande/bref.html Here is the style sheet: http://sandyfeldman.com/ondemande/css/ondemande.css And here are the tests which I have used to bang my head against the wall: test1 http://sandyfeldman.com/ondemande/test1.html no style on ressources no padding on the left, padding on the right is fine test2 http://sandyfeldman.com/ondemande/test2.html no style on ressources or configuration no padding on the left of ressources, configuration is fine test3 http://sandyfeldman.com/ondemande/test3.html padding-left : 47px on ressources the padding shows up on ressources, configuration is fine. Aha, I think, the padding needs to be expressed in px not in em test4 http://sandyfeldman.com/ondemande/test4.html padding in px on ressources and configuration no padding on the left of ressources, configuration is fine test5 http://sandyfeldman.com/ondemande/test5.html padding-left only on ressources and padding-left and right on configuration no padding on the left of ressources test6 http://sandyfeldman.com/ondemande/test6.html padding on li instead of link just doesn't work. Now, I don't exactly give up yet, but I can't think what's going on! thanks, in advance, for your help. Sandy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
