Re: [css-d] Font issue from Newbie

[Korpela Jukka]

Linda wrote:

 In my body css I have specified Arial but it shows up on my site in
 Times Roman, what am I doing wrong?

 http://www.uwba.org/eks/working_comp_home.php

You have
font: Arial, Helvetica, Verdana, sans-serif;
It does not work, since when using the font shorthand, you need to specify
at least the font size, right before the font family, e.g.
font: 100% Arial, Helvetica, Verdana, sans-serif;

Alternatively, use the font-family property instead of the font shorthand,
when you wish to set just the font family (font face):
font-family: Arial, Helvetica, Verdana, sans-serif;

As an aside, including Verdana is rather pointless here. How many
computers have Verdana but lack both Arial and Helvetica? Very very few if
any. And should such a situation really occur, the text would look much
bigger than using Arial or Helvetica. The system-dependent fallback
designated by the keyword sans-serif is probably a much better choice
then.

__
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] div with float doesn't stay inside parent container div

[Elli Vizcaino]

Floating the parent div should help contain the child divs. 

-Elli 




--- On Wed, 10/22/08, Philippe Wittenbergh [EMAIL PROTECTED] wrote:

 From: Philippe Wittenbergh [EMAIL PROTECTED]
 Subject: Re: [css-d] div with float doesn't stay inside parent container div
 To: CSS-D css-d@lists.css-discuss.org
 Cc: Leandro Tracchia [EMAIL PROTECTED]
 Date: Wednesday, October 22, 2008, 9:48 PM
 On Oct 23, 2008, at 9:57 AM, Leandro Tracchia wrote:
 
  my problem is exactly what this post is describing
 
 http://www.dynamicdrive.com/forums/archive/index.php/t-5372.html.
 i
  tried using min-height but that won't work.
 
  i have two divs inside one parent div. the two divs
 are floating left
  and filled with lots of text. but they are running off
 the parent div.
  i need the height of the parent div to grow or shrink
 with the amount
  of text in the child divs.
 
 
 Yes, that is the expected behaviour. The floated blocks are
 taken out  
 of the flow, and the parent div is technically
 'empty'.
 
 http://www.google.com/search?q=containing%20floats
 has the details, explanations and solutions.
 
 And ore from the CSS-D wiki
 http://css-discuss.incutio.com/?page=ClearingSpace
 
 Philippe
 ---
 Philippe Wittenbergh
 http://l-c-n.com/
 
 
 
 
 
 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 List wiki/FAQ -- http://css-discuss.incutio.com/
 List policies -- http://css-discuss.org/policies.html
 Supported by evolt.org --
 http://www.evolt.org/help_support_evolt/


  
__
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] div with float doesn't stay inside parent container div

[Leandro Tracchia]

thanks for everyone's help. looks like overflow:hidden is the latest
and greatest solution to this problem. worked for me just fine. here
is another webpage that also explains the problem and solution fairly
well: http://www.quirksmode.org/css/clearing.html

On Thu, Oct 23, 2008 at 9:30 AM, Elli Vizcaino [EMAIL PROTECTED] wrote:
 Floating the parent div should help contain the child divs.

 -Elli




 --- On Wed, 10/22/08, Philippe Wittenbergh [EMAIL PROTECTED] wrote:

 From: Philippe Wittenbergh [EMAIL PROTECTED]
 Subject: Re: [css-d] div with float doesn't stay inside parent container div
 To: CSS-D css-d@lists.css-discuss.org
 Cc: Leandro Tracchia [EMAIL PROTECTED]
 Date: Wednesday, October 22, 2008, 9:48 PM
 On Oct 23, 2008, at 9:57 AM, Leandro Tracchia wrote:

  my problem is exactly what this post is describing
 
 http://www.dynamicdrive.com/forums/archive/index.php/t-5372.html.
 i
  tried using min-height but that won't work.
 
  i have two divs inside one parent div. the two divs
 are floating left
  and filled with lots of text. but they are running off
 the parent div.
  i need the height of the parent div to grow or shrink
 with the amount
  of text in the child divs.


 Yes, that is the expected behaviour. The floated blocks are
 taken out
 of the flow, and the parent div is technically
 'empty'.

 http://www.google.com/search?q=containing%20floats
 has the details, explanations and solutions.

 And ore from the CSS-D wiki
 http://css-discuss.incutio.com/?page=ClearingSpace

 Philippe
 ---
 Philippe Wittenbergh
 http://l-c-n.com/





 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 List wiki/FAQ -- http://css-discuss.incutio.com/
 List policies -- http://css-discuss.org/policies.html
 Supported by evolt.org --
 http://www.evolt.org/help_support_evolt/




__
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] Background Images on List Items

[Chris Akins]

 The page in question
 http://www.college-algebra.com/essays/toc_essays.html
 In FF the background images on the gray menu items appear exactly where I
 want them between the left border and the text.
 In IE7 they are almost completely hidden under the left border.
 How do I correct this?


I haven't looked at your code, but can probably help.  If you haven't
started by zeroing out your margins AND padding on your list elements
(ul, li, a tags) then explicitly setting them in your stylesheet
rules, you'll often run into what you're seeing.  It's the differences
between browser defaults in how they treat list items.  Some browsers
use padding, some margins for their default settings.  To counter
this, you must make it look at the settings you want your list
elements to have.

Chris A.
__
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] Background Images on List Items

[Del Wegener]

Good Morning;

The page in question
http://www.college-algebra.com/essays/toc_essays.html
In FF the background images on the gray menu items appear exactly where I 
want them between the left border and the text.
In IE7 they are almost completely hidden under the left border.
How do I correct this?

Thanks for your help.

Del
[EMAIL PROTECTED]


__
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] div with float doesn't stay inside parent container div

[Thierry Koblentz]

 -Original Message-
 From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
 discuss.org] On Behalf Of Leandro Tracchia
 Sent: Thursday, October 23, 2008 7:15 AM
 To: CSS-D
 Cc: [EMAIL PROTECTED]; [EMAIL PROTECTED]; Philippe Wittenbergh
 Subject: Re: [css-d] div with float doesn't stay inside parent container
div
 
 thanks for everyone's help. looks like overflow:hidden is the latest
 and greatest solution to this problem. worked for me just fine. here
 is another webpage that also explains the problem and solution fairly
 well: http://www.quirksmode.org/css/clearing.html


This is another article on the subject [1] with a demo [2] on various
techniques.

[1]
http://tjkdesign.com/articles/clearing-floats_and_block-formatting_context.a
sp
[2] http://tjkdesign.com/articles/block-formatting_context/newBFC.asp


-- 
Regards,
Thierry | http://www.TJKDesign.com




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] div with float doesn't stay inside parent container div

[Leandro Tracchia]

amazing how much history is behind doing something that seems it
should be so easy to do.

On Thu, Oct 23, 2008 at 1:56 PM, Thierry Koblentz [EMAIL PROTECTED] wrote:
 -Original Message-
 From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
 discuss.org] On Behalf Of Leandro Tracchia
 Sent: Thursday, October 23, 2008 7:15 AM
 To: CSS-D
 Cc: [EMAIL PROTECTED]; [EMAIL PROTECTED]; Philippe Wittenbergh
 Subject: Re: [css-d] div with float doesn't stay inside parent container
 div

 thanks for everyone's help. looks like overflow:hidden is the latest
 and greatest solution to this problem. worked for me just fine. here
 is another webpage that also explains the problem and solution fairly
 well: http://www.quirksmode.org/css/clearing.html


 This is another article on the subject [1] with a demo [2] on various
 techniques.

 [1]
 http://tjkdesign.com/articles/clearing-floats_and_block-formatting_context.a
 sp
 [2] http://tjkdesign.com/articles/block-formatting_context/newBFC.asp


 --
 Regards,
 Thierry | http://www.TJKDesign.com





__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Background Images on List Items

[Del Wegener]

 The page in question
 http://www.college-algebra.com/essays/toc_essays.html
 In FF the background images on the gray menu items appear exactly where I
 want them between the left border and the text.
 In IE7 they are almost completely hidden under the left border.
 How do I correct this?

I tried your suggestions and got nowhere.  Probably my fault.

However, it seems that related to background-position
FF computes from the left edge of the left border
IE computes from the right edge of the left border

Armed with that guess I build an IE only stylesheet in which I set the
background-position 1em (the width of the left border) more than for FF. 
Worked GREAT!

Is my observation about the two methods of computing correct?

Thanks

Del 


__
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]

 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

[Gunlaug Sørtun]

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] Background Images on List Items

[Gunlaug Sørtun]

Del Wegener wrote:

 http://www.college-algebra.com/essays/toc_essays.html In FF the 
 background images on the gray menu items appear exactly where I 
 want them between the left border and the text. In IE7 they are 
 almost completely hidden under the left border. How do I 
 correct this?

 Is my observation about the two methods of computing correct?

No. :-)

1: delete the IE-only styles - it's the wrong approach.

2: add a 'hasLayout'[1] trigger to the anchor, as IE7 and older don't
recognize 'display: block' on its own, and _that_ is causing the problem.

Adding...
.navlist li a {height: 1%;}
...will do the trick.


If you want to fine-tune the line-up a little further across
browser-land, you can add...

.navlist li {margin-bottom: -1px; position: relative;}

...which will cover up for IE7' calculation errors and IE6' unstable border.

regards
Georg

[1]http://www.satzansatz.de/cssd/onhavinglayout.html
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] What is the offtopic address?

[Majestic]

What is the offtopic email address?
__
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] float problem: not being contained or something else?

[Luc]

 Good afternoon list,  

 Page:

 http://www.dzinelabs.com/sandbox/ieexpresssion.html

 Problem: next to the heading Departamento Logistica, you'll see two
 other headings, one on top of the other:

 Grupo Mendes Peres with the www..

 When resizing your browser, and also on resizing the font, all the
 headings shift way over. At first i thought it was a containing
 float problem but if i'm correct that only effects escaping floats
 vertically.

 I can't figure out how to resolve it. I tried using text-align
 instead of floats but no go.

 Any takers?
 
-- 
Best regards,
 Luc
 http://www.dzinelabs.com
 

Using the best e-mail client: The Bat! version 4.0.18 with Windows XP
(build 2600), version 5.1 Service Pack 2 and using the best browser:
Opera.

Even if you're on the right track, you'll get run over if you just
sit there. - Will Rogers.



__
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] float problem: not being contained or something else?

[Gunlaug Sørtun]

Luc wrote:

 http://www.dzinelabs.com/sandbox/ieexpresssion.html

 When resizing your browser, and also on resizing the font, all the 
 headings shift way over. At first i thought it was a containing 
 float problem but if i'm correct that only effects escaping floats 
 vertically.

Those headings are contained in #main-top, which has a 'width: 36em'
declared on it. This means it'll have a certain width, and that width
will change with font-resizing but _not_ with window-resizing.

By simply changing that to...

#main-top {width: 100%;}

...and deleting the left paddings on h1 and h2, the line-up will adjust
to window-size with the rest of the page, and won't be affected by
font-resizing.

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

[Sandy]

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] Div being cut off by IE6

[Majestic]

http://www.walkfar.ca/test/realdeal/animationpage9.html view it in IE6
you'll see compared to IE7 the bottom is cut off.

On 10/22/08, David Laakso [EMAIL PROTECTED] wrote:
 Majestic wrote:

  I have a div that IE6 is cutting off at the bottom and you are
  prevented from scrolling down as well.  This is not happening in any
  other browser, any idea?
 
 
 


  Put it on your server and point to it in your post.







  --

  A thin red line and a salmon-color ampersand forthcoming.

  http://chelseacreekstudio.com/


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] flyout menus + IE6 making progress, still need help

[Jody Levinson]

OK, so I redid the menus using the code  Bob pointed me at and they  
are working better and look promising for IE6. I'm still having some  
issues that I can't quite track down.

The new page is here: http://www.atlas-inspection.com/newsite/newnavtest.html
And the css for the menus is here: 
http://www.atlas-inspection.com/newsite/test1.css

In FF, in the vertical menu, the third level isn't working at all and  
the widths of the second level are a little screwy with the text  
running over the right edge.

In IE6, on the horizontal menu, when you hover, the block widens  
enough to pop the last item to the next line. I can't track down  
what's doing that.

In the vertical menu, the third level also isn't working, the heights  
of the items change on hover and the widths aren't working the same as  
in FF.

But I feel I'm making progress!

Any help on these issues is very much appreciated.

Thanks,

Jody


On Oct 23, 2008, at 11:00 AM, Bob Meetin wrote:




 Jody Levinson wrote:
 These menus work so well in IE7 and FF, but they are completely
 unusable in IE6. Can anyone please help or point me toward some
 resources to resolve it or work around it?

 Thank you.

 http://atlas-inspection.com/newsite/

 http://www.atlas-inspection.com/newsite/styles.css

 Thank you for any assistance!

 Jody

 I have a number of menu examples of drop-down menus based on the  
 Eric
 Meyer examples from 'More Eric Meyer on CSS' on this page.  They  
 use a
 csshover.htc file to make it work in IE6.

 http://www.dottedi.biz/codesamples/

 My question, what does fly-out menu actually mean?

 -- 
 Bob Meetin
 www.dottedi.biz
 303-926-0167

 Hook up with me on Twitter, Facebook, LinkedIn, Plaxo Pulse and Bebo
 or catch my blog at www.dottedi.biz/blog.php

 Standards - you gotta love em - there are so many to choose from!

 __
 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/

 -- 
 TroutDream Graphics, Inc.
 Always fresh. Never canned.
 http://troutdream.com
 425-883-8277
 928-833-8277 fax




 -- 
 Bob Meetin
 www.dottedi.biz
 303-926-0167

 Hook up with me on Twitter, Facebook, LinkedIn, Plaxo Pulse and Bebo
 or catch my blog at www.dottedi.biz/blog.php

 Standards - you gotta love em - there are so many to choose from!


--
TroutDream Graphics, Inc.
Always fresh. Never canned.
http://troutdream.com
425-883-8277
928-833-8277 fax

__
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] Background Images on List Items

[Del Wegener]

 Adding...
 .navlist li a {height: 1%;}
 ...will do the trick.
 Georg

 [1]http://www.satzansatz.de/cssd/onhavinglayout.html
 -- 
 http://www.gunlaug.no

Thanks Georg.  That worked fine.  I have no idea why, but maybe I will 
understand it better after I study [1] above.
I do like the idea of avoiding an ie stylesheet.

Del 


__
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] Right Column Overlapping Left Column In All Browsers

[Elli Vizcaino]

Hello Gang,

Not sure what in the world is going on but I have the right column overlapping 
the left column and it refuses to budge. I tried floating them because the 
parents are floated but that didn't work. Can someone please explain what is 
happening?

http://mt41-blogs.petside.com/petside/


TIA,
Elli 



  
__
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] Right Column Overlapping Left Column In All Browsers

[David Laakso]

On Thu, Oct 23, 2008 at 8:20 PM, Elli Vizcaino [EMAIL PROTECTED] wrote:

 Hello Gang,

 Not sure what in the world is going on but I have the right column
 overlapping the left column and it refuses to budge. I tried floating them
 because the parents are floated but that didn't work. Can someone please
 explain what is happening?

 http://mt41-blogs.petside.com/petside/


 TIA,
 Elli





I am not sure if this will work for you.
Try:
.module{
float: left; - :: delete
float: right; - :: add
margin-bottom: 20px;
}
Although it probably has nothing to do with the issue at hand a visit to the
markup validator and Tidy Online might be in order.








-- 
http://chelseacreekstudio.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] hello?

[Carla Bruni]

Where is everybody? It's so quiet here


  
__
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] float problem: not being contained or something else?

[Luc]

Hello Gunlaug, 

It was foretold that on 23/10/2008 @ 01:26:02 GMT+0200 (which was
21:26:02 where I live) Gunlaug Sørtun would write:

snipped a bit

 Those headings are contained in #main-top, which has a 'width: 36em'
 declared on it. This means it'll have a certain width, and that width
 will change with font-resizing but _not_ with window-resizing.

 By simply changing that to...

 #main-top {width: 100%;}

 ...and deleting the left paddings on h1 and h2, the line-up will adjust
 to window-size with the rest of the page, and won't be affected by
 font-resizing.

That's indeed simple lol.

Your solution works for the main-top but i tried the same for the
nested puller2 div but i had no luck. That one still gives me the
same problem.

I also have a float drop in IE: resizing drops the whole content
beneath the nav. Have i messed up my math somewhere?

http://www.dzinelabs.com/sandbox/ieexpresssion.html

-- 
Best regards,
 Luc
_


Using the best e-mail client: The Bat! version 4.0.18 with Windows XP
(build 2600), version 5.1 Service Pack 2 and using the best browser:
Opera.

To bookmark this homepage or not to bookmark, that is the question. 


__
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] float problem: not being contained or something else?

[Gunlaug Sørtun]

Luc wrote:
 Hello Gunlaug,
 
 It was foretold that on 23/10/2008 @ 01:26:02 GMT+0200 (which was 
 21:26:02 where I live) Gunlaug Sørtun would write:
 
 snipped a bit
 
 Those headings are contained in #main-top, which has a 'width: 
 36em' declared on it. This means it'll have a certain width, and 
 that width will change with font-resizing but _not_ with 
 window-resizing.
 
 By simply changing that to...
 
 #main-top {width: 100%;}
 
 ...and deleting the left paddings on h1 and h2, the line-up will 
 adjust to window-size with the rest of the page, and won't be 
 affected by font-resizing.
 
 That's indeed simple lol.
 
 Your solution works for the main-top but i tried the same for the 
 nested puller2 div but i had no luck. That one still gives me the 
 same problem.

Delete 'width: 18em' on #puller2 and let that float default to 'width:
auto' and shrink-wrap. Delete 'margin-left: 1em' while you're at it.
That will give you the most stable line-up, at the right edge of #main-top.


 I also have a float drop in IE: resizing drops the whole content 
 beneath the nav. Have i messed up my math somewhere?

Think so :-)

It is the percentage (not 100%) that makes it a little harder to
calculate trigger-points. I usually just test and tweak until it is
close enough for comfort.

A quick test gives me these values for near-flawless operation on 96dpi
resolution screens...

* html #container{ width:expression(
(document.documentElement.offsetWidth) (830/12)
* parseInt(document.body.currentStyle.fontSize)?  48.75em
: ((document.documentElement.offsetWidth) (600/12)
* parseInt(document.body.currentStyle.fontSize)? 34.75em : 96%)); }

I raised min-width to 34.75em because IE6 has a tendency to drop content
too early on narrow windows.

That expression do not work well on other screen-resolutions than 96dpi
- the most widespread one that IE6 may be found on at the moment, and
there's not much I can do about that since resolution can't be easily
checked and used as a variable in expressions.

 http://www.dzinelabs.com/sandbox/ieexpresssion.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/