Re: [css-d] IE spacing problems on nav list

[Liz]

On 8/15/06 11:13 PM, "David Laakso" <[EMAIL PROTECTED]> wrote:

> Liz wrote:
>> 
>> I added margin-bottom: 8px; to "#navcontainer a" to get the space I want
>> between the background blocks.  The space is the way I want it on Safari and
>> FireFox but way too spread out vertically on IE on the PC.  How can I get
>> the space I want to work it least closely on all (modern) browsers?
>> 
>> sample is http://www.liztestsite.com/kh/sample.html
>> Liz
> Liz,
> Try adding 100% width to the a for an ie haslayout trigger [1]:
> #navcontainer a { width: 100%; }
> [1] 
> Best,
> ~dL
> PS Don't for get to give your final page a background-color (I default
> to fuchsia in Opera to catch myself)
> 
> 
> 
Actually it worked well until I tried a mouse-over.  Then it  collapses in a
wierd way on IE on the PC.  Sample is still at
http://www.liztestsite.com/kh/sample.html  Do I need to put that width other
places as well?

Regards,

Liz


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] IE spacing problems on nav list

[Liz]

That fixed it. Thank you!

Liz

On 8/15/06 11:13 PM, "David Laakso" <[EMAIL PROTECTED]> wrote:

> Liz wrote:
>> 
>> I added margin-bottom: 8px; to "#navcontainer a" to get the space I want
>> between the background blocks.  The space is the way I want it on Safari and
>> FireFox but way too spread out vertically on IE on the PC.  How can I get
>> the space I want to work it least closely on all (modern) browsers?
>> 
>> sample is http://www.liztestsite.com/kh/sample.html
>> Liz
> Liz,
> Try adding 100% width to the a for an ie haslayout trigger [1]:
> #navcontainer a { width: 100%; }
> [1] 
> Best,
> ~dL
> PS Don't for get to give your final page a background-color (I default
> to fuchsia in Opera to catch myself)
> 
> 
> 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] IE 3-pixel bug problem revisited

[Karl Jacobs]

Hello,

I've got a question regarding the IE 3-pixel bug problem.  (I've read over
the Molly/John page on this a dozen times).

I have been using the {height:1%;} to fix the bug in most of my layouts
where needed. However, I've come across a situation where it breaks
something worse that the problem it fixes.

In my layout, I have a floated left-nav, a center column for content, and a
floated right-column that has some links and such in it.

The center column is controlled by using the left and right margins, as many
sites do now.  The content is allowed to flow around the right float.

The problem is that when I apply the {height:1%;}, then the content will not
wrap around the right float.  It treats the left edge of the right float as
a hard margin, and all the content stays between the two floats.

Is there a way around this?...

I have tried applying the -3px right-margin fix to the left float, but that
appears to have no effect.

Any other ways?...

Thanks,

-- Karl
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] IE spacing problems on nav list

[David Laakso]

Liz wrote:
>
> I added margin-bottom: 8px; to "#navcontainer a" to get the space I want
> between the background blocks.  The space is the way I want it on Safari and
> FireFox but way too spread out vertically on IE on the PC.  How can I get
> the space I want to work it least closely on all (modern) browsers?
>
> sample is http://www.liztestsite.com/kh/sample.html
> Liz
Liz,
Try adding 100% width to the a for an ie haslayout trigger [1]:
#navcontainer a { width: 100%; }
[1] 
Best,
~dL
PS Don't for get to give your final page a background-color (I default 
to fuchsia in Opera to catch myself)


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] IE spacing problems on nav list

[Liz]

Hello,

I'm trying to revise a list I got from Listamatic. There, the list has no
space between the links.

I added margin-bottom: 8px; to "#navcontainer a" to get the space I want
between the background blocks.  The space is the way I want it on Safari and
FireFox but way too spread out vertically on IE on the PC.  How can I get
the space I want to work it least closely on all (modern) browsers?

sample is http://www.liztestsite.com/kh/sample.html

Thanks in advance,

Liz


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] splunk - splash page typo-effect

[David Laakso]

Rodrigo Alexandre wrote:
> You might already know Splunk - www.splunk.com -Have you noticed how the word 
> in "What's xx in
> your IT infrastructure today?" swaps from time to time, simulating an
> ongoing writting on the screen? 
> How do they do that? Any ideas?
>   
I have no idea. Fortunately, I can make it stop by disabling javascript 
(or simply leaving their site as quickly as possible).
> Rodrigo
>   
Regards,
~dL
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] image map in fluid layout and site check please

[David Hucklesby]

On Tue, 15 Aug 2006 09:48:18 -0400, Miki Kersgard wrote:
> I have a map of our state with all of the counties as hotspots and
> need to put them into my (first) fluid layout. Does anyone have an
> idea of how I handle this. Using an old map as a test (much nicer
> map to come) it lost all the linking abilities when made fluid.
>
Miki, you seem to have lost the 'usemap' attribute from your IMG tag!

You have triggered the "extreme font resizing bug" in IE[1]. Adding
a 100% font-size declaration to the BODY selector should fix it.

Let us know if you run into problems with CSS. Good luck.

Cordially, David.
[1] 
--
www.hucklesby.com


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] input question

[Donna Jones]

(sigh, realized i answered Georg instead of replying to the list - 
someday i'll learn.  pasting, re-sending.)


 >> http://www.maineddc.org/draft/index.htm

 >> Everything is fine now, but I'm sure I'm missing something theory or 
something about how I should have dealt with this.  and doubt very much 
that i've done it the best way.
 >
 > Not too many ways to do it, and yours is as good as any :-)
 > Any block-element will do (in theory at least), so we just pick the one
 > that makes most sense in each case.


Wow, that's a surprise, thanks Georg!

Why does input have to be enclosed in a block level element though?  It 
just occurred to me that maybe input is "inline" 

Well, I just consulted Eric's "main css book" and couldn't find an 
answer though it does look like input is a "replaced element".  So, does 
it have to do with "inline and replaced elements" not being "in the clear"?

cheers
Donna



-- 
Donna Jones
Portland, Maine
207 772 0266
http://www.westendwebs.com/


-- 
Donna Jones
Portland, Maine
207 772 0266
http://www.westendwebs.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Site Check

[David Hucklesby]

Hi Richard,
You wrote:
>
> I am building a three column site at:
> 
> 
>
> The middle column seems to be disappearing. Can people see in it in
> Internet Explorer please and if not why is it disappearing please?
>
Yes, I see it. It has dropped below the surrounding columns.
I think the problem is the legend in the fieldset. Opera breaks it up
in order to make room between the outer columns. Firefox expands
the center column into the right one, as per spec. IE expands the
width of the column, so it drops.

Try making the legend shorter and see if that works. If it does, be
aware that any increase in text size by the visitor may again make
it too long, with similar results.

Cordially, David.
--
www.hucklesby.com



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] splunk - splash page typo-effect

[Rodrigo Alexandre]

You might already know Splunk - www.splunk.com -, but this is
something new for me. What brings it to the discussion here has
nothing to do with the system itself, though i would be glad to haer
about it as well. Have you noticed how the word in "What's xx in
your IT infrastructure today?" swaps from time to time, simulating an
ongoing writting on the screen? But if you check the code, there's
nothing like an animated gif or something, but just plain html text.
How do they do that? Any ideas?
Rodrigo
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Shrinking the Browser causes layout problems...

[.m. aquilina]

Hi,

I finally got my layout to work in IE, FireFox and Netscape (have yet to 
check in on Safari), and was feeling pretty excited about having figured out 
how to use css.. until I discovered that if i shrunk my browser, the content 
to the right shifted right over the left content.  They overlapped on to 
each other.

Is there some way of fixing this?  Ideally if the browser was minimized I 
would like the page to still be legible by using the browser scroll on the 
bottom.  I'm guessing from what I researched over the Internet it may have 
something to do with the "position" or "float" tag.   If somebody could 
please direct me I'd super grateful.

Here's what my code looks like. My layout is just a 2 column page with a 
boarder around it. Content on the left, and content on the right.



body {
margin: 0px 0px 0px 0px;
padding: 0px;
}

#left {
width: 265px;
position:absolute;
border-left:1px solid silver;
border-bottom:1px solid silver;
border-top: 1px solid silver;
padding-bottom:20px;
height:398px;
margin-left: 180px;
margin-top: 30px;
}

#right {
 width:590px;
 position: absolute;
 border-right:1px solid silver;
 border-top: 1px solid silver;
 border-bottom:1px solid silver;
 padding-bottom:20px;
 height:398px;
 margin-left: 27%;
 margin-top: 30px;
 margin-right:17%;
 }

p.leftcontent {
width: 125px;
border-top: 1px solid silver;
margin-top:25px;
margin-left: 10px;
margin-right: 5px;
padding-top: 15px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
text-indent:  5px;
text-align:center;
}

p.special{
width: 125px;
border-bottom: 1px solid silver;
margin-top:25px;
margin-left: 10px;
margin-right: 5px;
padding-bottom: 15px;
font-family: Arial,Verdana,Helvetica,sans-serif;
font-size: 11px;
color: #33;
font-weight: bold;
text-align:center;
text-indent:  5px;
}

p.right   {
 border-top: 1px solid silver;
margin-top:25px;
margin-left: 10px;
margin-right: 5px;
padding-top: 15px;
font-family: Arial,Verdana,Helvetica,sans-serif;
font-size: 11px;
color: #33;
text-align:justify;
}




ROD  
bio

 
 adfkadfjladj  afdjaslkfjsladki
  




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] input question

[Gunlaug Sørtun]

Donna Jones wrote:

> http://www.maineddc.org/draft/index.htm

> Everything is fine now, but I'm sure I'm missing something theory or 
> something about how I should have dealt with this.  and doubt very 
> much that i've done it the best way.

Not too many ways to do it, and yours is as good as any :-)
Any block-element will do (in theory at least), so we just pick the one
that makes most sense in each case.

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[francky]

francky wrote 04:25:

>[...]
>  
>
After finishing my writing, I went back to my Inbox and saw Sandra's 
post of 03:15.
Work is going on!

francky

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] input question

[Donna Jones]

Hi folks:

I have a question/issue with this page:

http://www.maineddc.org/draft/index.htm

I decided to switch my doctype from 4.01 transitional to 4.01 strict. 
Which ended up with me getting lots of errors on the two forms.  The two 
forms are the search from WebSide Story and the javascipt style switcher 
from A List Apart (which used xhtml transitonal, btw).

so, the validator essentially said i had to enclose all inputs in a 
block element.  I did something weird, maybe creative?, i made a 
division called class="null" and didn't put anything in the css for it. 
  Of course, it was then displayed as a block, which i didn't want, so I 
just said "display: inline" in the css.

Everything is fine now, but I'm sure I'm missing something theory or 
something about how I should have dealt with this.  and doubt very much 
that i've done it the best way.

I wondered if I should have used "labels", but ran it through Cynthia 
before making the changes and it didn't say anything about that.

thanks very much for helping me correct my errant ways.

Donna

-- 
Donna Jones
Portland, Maine
207 772 0266
http://www.westendwebs.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Safari screw up

[David Laakso]

Kenoli Oleari wrote:
> Usually Safari is the browser that works for everything, but the  
> following page works on Mac versions of FF and IE perfectly and  
> completely breaks on Safari.  I have validated both the xhtml and the  
> CSS.  Can anyone help me?
>
> It seems to be ignoring the div background colors and screwing up the  
> absolute positioning.  I've gone over and over the code, pulling  
> sections and looking for small errors and can find nothing.
>
> http://www.communityassemblies.org/staging/index_nan.php
>
> (It has a php extension because there is some php code in it that I  
> have removed, though it causes the same problem regardless of the  
> extension or the code.)
>
> The styles that relate to the divs are included below.
>
> --Kenoli
>
>   
Unfortunately, valid files are no guarantee that a site will actually 
work, function, and be usable cross-browser. The problem is the use of 
absolute positioning to layout the page. And while it may seem to you to 
be only a Safari problem, I regret that that is just not so. A simple 
float layout will handle that content without any problem. No absolute 
positioning is necessary. A simple structural layout test is to zoom the 
fonts to 200%. In xp ff, this turns your page into quite a turmoil. Even 
though the fonts are frozen in ie6.0, the page bears no resemblance to 
its compliant browser sisters. While it may be a difficult pill to 
swallow--  personally, I'd consider a less ambitious, but workable 
cross-browser solution that doe not include absolute positioning.
Best,
~dL

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[francky]

Sandra Davis wrote:

>[...]
>Yes, I remember the painful decision to step away from standards
>everywhere with this client. It's a kludge at this point. I agree. 
>
>This layout is definitely killing some end user experiences.
>Client-insistence is strong in favor for the too dark, line reading
>width too long.  Only IE 6 and above, if that. No screen readers...
>100% fluid width not consistent. 
>
>No 800px, not even 1024! I butchered a full working standards-template
>to get it to this current beauty.
>  
>
Hi Sandra,
Yes, client is king; but he should know the visitor has to be the 
emperor - in case the goal is to attract reading visitors, and not to 
have a beauty of a site under some special conditions... *)

>Yes IE jumps... Barely getting just FF & IE addressed. Statistics show
>50-50% these 2, with 1% other browser use likely generated from
>testing, 1% IE 5 not past 2001.
>
>Definitely at the "work somewhat" stage.
>
>I've now decided to do a major pruning and just go back to a
>only-for-FF story board with header-footer, otherwise empty
>body/wrapper. I'll post if success. Yes weird on the earlier 
>comment, it was a early AM hack for IE, it has to go anyway for even a
>minimal degrade to work at this point.
>  
>
I was looking for the "FF-center-problem", and isolating the menu I 
discovered:

* It is also IE which doesn't center the menu-items properly. That
  becomes visible if the site is viewed in 1024x768px: then the
  "Testimonials" item is on the 2nd line, but on the left side
  instead of centered.
* Made a 1st testpage
  .
  Result (viewed in 1280x1024px without a sidebar): in FF the menu
  has a gap at the right side, the second line is leftsided.
  Though in IE the menu is centered (and the second line leftsided too).
* Then made a 2nd testpage
  .
  Only difference: replaced the ... by a normal
  ... set.
  Result: in FF exactly the same as the first testpage.
  IE however is now acting in the same way as FF.

My conclusions:

* It is pure coincidence that IE is centering with the "del-hack".
  And: the "del-hack" is only partially: at wrapping because of a
  smaller window the second line is not centered.
* The centering of all containers around the menu- is perfect in
  both testpages in all browsers (as in the original), just doing
  what is expected according to the w3c rules.
* It must be the positioning of the list-items inside the menu-.
  Indeed a "common css problem", and no direct relationship with any
  validation. ;-)

So I think the centering problem can be solved, with for example the 
Sons of Suckerfish as a good starting point.
Must be possible for FF and IE and others as well - with some special 
arrangements for ... (guess who) IE. :-)
See testpage Centered Suckerfish 
.
**)
It doesn't say everything, like Georg pointed, but ... it validates 
(html and css).

Greetings,
francky

btw: Maybe there can be saved some download time, if you make a div 
around the header and the menu together, and put 1 combined mountain 
image in it as background.

*)
The website in this way is the opposite of his own philosophy:
"So, let go of the strategies to control and manipulate life and simply 
let it be.
(...) Together we can play in the Dream of Unity that has been here all 
long!"

Unity in terms of who?
Prescribing:
- I've to buy a monitor 1280x1024+ if I haven't,
- I've to set my resolution (or min. window size) on 1280x1024+ if I 
haven't,
- I've to (install and) see the site in IE if it's not my default browser,
- I've to set the font size at "normal" to get a proper display, even if 
I can't read the text then,
- I've to install the latest FLASH player if I haven't,
- I've to mouse over the whole screen to see of there are some hidden links,
- and so on ...

**)
I couldn't test IE7; IE6 on Win is o.k., like FF1.07 and Opera8.01.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[Sandra Davis]

--- Gunlaug Sørtun <[EMAIL PROTECTED]> wrote:
> Not really, but I can add a suggestion now :-)
> 
> html>body del.container {width: 100%; max-width: 1024px; margin: 0
> auto; display: table; }
> 
> ...which must be the strangest element-choice any menu have been
> centered in so far. Do you really mean to del(ete) that menu?
> 
> Anyway, the addition above will make Firefox line up that menu like
> IE6 does on any screen from around 540 to well above 3800 in
window-width - with the exception of a few exclusive IE-bugs and the
fact that IE6 is fed differently arranged source-code.

Georg - it's centered now on both. Thank you. Your code centered on FF,
uncentered on IE (which is better! I agree with all the comments here
noticing that my IE code is hack atop of hack.). 

I took off the width:100%, and the IE went back to its error-proned
jump to center yet the FF stayed put (centered). So both centered.
Super.

I limp forward. I severely regret abandoning my tried & true design
practices for this client friend back in February. 

If you looked at the running site http://www.keshavhowe.com you'll see
just how far his true tastes weren't being reflected in his beta blue
site (the site helped with, on its /7/ seventh iteration...)

At least now I have a good story to tell in upcoming semester classes
where I am invited to speak on undergraduate software design work. 

The never-ending kludge... why to run lean and mean from the get-go.

Sandra

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] need help to get rid of my table (newbie)

[Patrick Aljord]

ok thanx to all I'm going to try this.

On 8/14/06, David Laakso <[EMAIL PROTECTED]> wrote:

> In the meantime, this may give you an idea for one approach to what I
> guess(?) you are attempting:
> 
it looks like it has been deleted from the server, i dont have the net
at home so i can only connect once a day from a net cafe for now.
Could you put it back please or send it by mail :) ? though I'm sure
I'll be ok with Jon's explanation so dont bother if you dont have
time.

> PS Remember to start with a doctype.
thanx for the advice

Pat
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Safari screw up

[Kenoli Oleari]

Usually Safari is the browser that works for everything, but the  
following page works on Mac versions of FF and IE perfectly and  
completely breaks on Safari.  I have validated both the xhtml and the  
CSS.  Can anyone help me?

It seems to be ignoring the div background colors and screwing up the  
absolute positioning.  I've gone over and over the code, pulling  
sections and looking for small errors and can find nothing.

http://www.communityassemblies.org/staging/index_nan.php

(It has a php extension because there is some php code in it that I  
have removed, though it causes the same problem regardless of the  
extension or the code.)

The styles that relate to the divs are included below.

--Kenoli

body {
background-color: #E5;
position:absolute;
left:11px;
top:12px;
width:722px;
height:768px;
z-index:1;
}

#header {
position:absolute;
width:703px;
height:107px;
z-index:5;
left: 4px;
top: 3px;
}

#column_right { overflow: scroll; }

#link_bar {
position:absolute;
width:725px;
height:18px;
z-index:6;
top: 162px;
left: -2px;
background-color: #E5;
border: 1px none #00;
}

#vertical_bar {
position:absolute;
left:-1px;
top:193px;
width:5px;
height:388px;
z-index:7;
background-color: #CC9933;
border: 1px none #00;
}

#left_nav {
position:absolute;
width:155px;
height:278px;
z-index:4;
left: 8px;
top: 195px;
background-color: #CC;
border: 1px none #00;
padding-left: 8px;
}

#consult {
position:absolute;
width:147px;
height:87px;
z-index:10;
left: 8px;
top: 478px;
border: solid black 0px;
padding: 8px;
background-color: #CC9933;

#main_text {
position:absolute;
left: 179px;
top: 192px;
width:413px;
height:388px;
z-index:3;
}

#main_text_header {
position:absolute;
width:108px;
height:32px;
z-index:2;
left: 4px;
top: 10px;
}

#nan_def {
position:absolute;
width:176px;
height:73px;
z-index:2;
left: 11px;
top: 59px;
text-align:
left;
}

#main_text_image {

position:absolute;
left: 201px;
top: 10px;
width:199px;
height:120px;
z-index:2;

}

#main_text_text {
position:absolute;
width:395px;
height:221px;
z-index:2;
left: 5px;
top: 147px;
}




Kenoli Oleari
Neighborhood Assemblies Network
[EMAIL PROTECTED]
510-601-8217
http://www.sfnan.org
http://www.horizonsofchange.com


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] [off-topic] FriendlyURL or Permalinks

[Jim Nannery]

J Robson wrote


> Hi,
>
> How I make to make FriendlyURL or Permalinks using IIS (Windows) as I
> make with Apache .htaccess?
>
>
>
> Thanks,
>
> J. Robson

Try one of  the discussion lists in the "off topic" [1] page of the CSS-D 
Wiki I'm sure you'll have better luck getting the answer you seek...

[1] http://css-discuss.incutio.com/?page=OffTopic

Jim Nannery
www.backporchgames.com 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] DIV spacing renders differently in IE and Firefox

[Janet Chang]

At 03:00 PM 8/15/2006, David Laakso wrote:
>Janet Chang wrote:
>>I can't for the life of me seem to figure out why the spacing between 
>>certain DIVs in the web page I'm working on are rendering differently in 
>>IE and Firefox.
>>
>Me either.
>>Sample page: http://www3.law.northwestern.edu/faculty/profiles/JamesSpeta/
>>
>>The spacing between the last list item in "Areas of Expertise" and the 
>>"Courses" heading (and between the last item under "Courses" and the 
>>"Publications" heading) should be the same as the spacing separating the 
>>rest of the sections lower down on the page.
>>
>.section h2 {
>  padding-top: 17px;
>}
>
>* html .section h2 {
>  padding-top: 0;
>>Janet Chang
>>
>>
>~dL

Thanks for the reply. I tried that, too, but it also increased the space 
between the lower sections so that they remained uneven with that of the 
top three sections.

As another course of action, I tried deleting clear:both in my div.section, 
and instead added a  tag after the "Areas of Expertise" and "Courses" 
sections and set br {clear: both} in my CSS.

Now it looks correct in Firefox, but the spacing is too narrow in IE (!?!)  


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] [off-topic] FriendlyURL or Permalinks

[J. Robson]

Hi,

How I make to make FriendlyURL or Permalinks using IIS (Windows) as I
make with Apache .htaccess?



Thanks,

J. Robson
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] DIV spacing renders differently in IE and Firefox

[Gunlaug Sørtun]

Janet Chang wrote:
> http://www3.law.northwestern.edu/faculty/profiles/JamesSpeta/

> The way it looks in IE 6 is the way I want it to look. However, in 
> Firefox, the top three sections are squished together. If I add 
> spacing to accommodate Firefox, then there is too much space in IE.
> 
> [...]I don't think this is related to the box model problem, though, 
> as my column divs only have width set and the problem is in the 
> top/bottom spacing not left/right.
> 
> Any ideas for how I can get it to match across browsers?

Yes, IE got it wrong, as the 'width' acts as a 'hasLayout'[1] trigger,
making it expand the containers.

Add (as a test)...

div#content div {overflow: hidden; *overflow: visible;}

...which will make it appear as you want.

Then use the most suitable one of the properties that enforces a
'block formatting context'[2] in standard-compliant browsers, only to
the correct containers. That'll give you a match.

regards
Georg


[1]http://www.satzansatz.de/cssd/onhavinglayout.html
[2]http://www.w3.org/TR/CSS21/visuren.html#q15
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Relative Positioning / Floats and Document Flow

[Jason Manaigre]

Hi everyone, I've got a bit of funk on my hands.

http://test.iisd.org/revamp/

The issue is with the 'Our Knowledge' link it turns on a hidden div
using JavaScript.

The problem is, it takes up all space in the regular document flow,
which is no good. I just want it to float.

I wanted to use relative positioning so that when the browser resizes,
the div is in the proper location.

Which isn't the case with an absolutely positions div.

Any ideas people?

The CSS file is here http://test.iisd.org/revamp/main.css

I gata be doing something dumb here... 


Thanks for any info.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] DIV spacing renders differently in IE and Firefox

[David Laakso]

Janet Chang wrote:
> I can't for the life of me seem to figure out why the spacing between 
> certain DIVs in the web page I'm working on are rendering differently in IE 
> and Firefox.
>   
Me either.
> Sample page: http://www3.law.northwestern.edu/faculty/profiles/JamesSpeta/
>
> The spacing between the last list item in "Areas of Expertise" and the 
> "Courses" heading (and between the last item under "Courses" and the 
> "Publications" heading) should be the same as the spacing separating the 
> rest of the sections lower down on the page.
>   
.section h2 {
  padding-top: 17px;
}

* html .section h2 {
  padding-top: 0;
> Janet Chang
>
>
>   
~dL
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] DIV spacing renders differently in IE and Firefox

[Janet Chang]

I can't for the life of me seem to figure out why the spacing between 
certain DIVs in the web page I'm working on are rendering differently in IE 
and Firefox.

Sample page: http://www3.law.northwestern.edu/faculty/profiles/JamesSpeta/

The spacing between the last list item in "Areas of Expertise" and the 
"Courses" heading (and between the last item under "Courses" and the 
"Publications" heading) should be the same as the spacing separating the 
rest of the sections lower down on the page.

The way it looks in IE 6 is the way I want it to look. However, in Firefox, 
the top three sections are squished together. If I add spacing to 
accommodate Firefox, then there is too much space in IE.

I have a feeling the issue has to do with some conflict between the section 
div and the 2-column divs I'm using under "Areas of Expertise" and 
"Courses," but I can't figure out how to fix it. I don't think this is 
related to the box model problem, though, as my column divs only have width 
set and the problem is in the top/bottom spacing not left/right.

Any ideas for how I can get it to match across browsers?

Janet Chang
Communications Editor
Northwestern University School of Law
http://www.law.northwestern.edu


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] wierd safari problem

[Ingo Chao]

Ingo Chao wrote:
> [EMAIL PROTECTED] wrote:
>> Have a look here on safari I get a strange 40px on the left hand side,  the 
>> map seems to repeat a portion of itself..
> 
>> http://edinburghrooftops.com/jeffrey_street/jeffrey_st_location.php
> 
> 
> Your bg-image is wider than its container, and it is offset to the right.
> 
> I think it is
> http://bugzilla.opendarwin.org/show_bug.cgi?id=3237
> still wrong in Safari 2.0.4
> 
> Fixed in current nightly builds.
> 
> 
> Unrelated to this, you should not use inline styles.

Ok, you may use inline styles to taste.

It would be nice to get a reply if my 15 min to search your bug did help.

Ingo


-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Sliding door rounded corner boxes

[Pete Home]

OK, I seem to have sorted out most things, with only a couple of small
errors in IE. I assume that this is where I need the hacks.

I now have 3 pages, www.cityboxer.com/gambling/betting.htm and
www.cityboxer.com/gambling/betting2.htm have similar problems with the
bottom #shop etc

www.cityboxer.com/newsite/contact/contact_form/register_form1.asp seems to
be expanded vertically for some reason which is causing the same problem
with the images (I know Francky's solution should solve this, but I still
cannot get my head around it and anyway the expanded layout is a pain)

Any ideas?

Regards
Pete 

-Original Message-
From: francky [mailto:[EMAIL PROTECTED] 
Sent: 15 August 2006 04:44
To: [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Sliding door rounded corner boxes

Pete Home wrote:

>I'm getting so frustrated with this. 
>
>I'm assuming that certain TAGs break the flow within this technique 
>therefore interrupting the image outlines causing what looks like 
>breaks in the border for instance.
>
>My site is very standard in layout with basically a top menu, header, 
>content and footer (see www.cityboxer.com/gambling/betting.htm). I want 
>the content to always have a rounded corner border. Francky fixed the 
>problems in FF with this page, so I then replaced the content with a 
>form and saved it as 
>www.cityboxer.com/newsite/contact/contact_form/register_form1.htm) and it
all goes wrong again.
>
>Has anyone used this technique as a template for many other sorts of pages?
>
>Regards
>Pete
>  
>
Aha! Don't give up! Assumption wrong...
I took some screen shots, and yes:

* the corner box has a height of 765px (in resolution 1024x768,
  font-size normal in FF),
* the box_bottomleft.gif and box_bottomright.gif are 700px in height,
* we can see a gap of  65px at the top (for the images are
  positioned at the bottom of the div).
* ;-)

Can be solved in 2 ways:

   1. extending the images in height, for the method is based upon
  images as high as the max. box you need.
   2. using repeated-y images of 1px height for the left and right
  borders (and appropriate css).

This is exactly the reason why I prefer the method 2 template: always
self-adapting, no worry about a new page which can have more height as the
page you developed the "big images" for, - which appear to be not big
enough.
As I said 13-08 (or 08-13):

>> "O, the box is breaking also at large font sizes. I guess because of not
enough height of the box_bottomleft.gif and box_bottomright.gif."

Method 2 is used in my earlier testpage c
.
I used that page (exactly the the same css) to paste a long "form" in
it: testpage d
.
:-)

Greetings,
francky

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] @page and IE6

[Eva Vartmann]

Jim Nannery wrote:

>Morning Eva
>
>You wrote
>
>  
>
>>Hi,
>>
>>I'm trying get a print stylesheet to force the user agent to print a
>>page landscape so I'm using:
>>
>>@page {size:landscape;}
>>
>>This works fine in Firefox but not IE6. Does anyone have any info on this?
>>
>>Thank you,
>>Eva
>>
>>
>>
>
>The CSS-D wiki [1], while a bit dated, has info on this.  IE 6 does not 
>support the @page rule for forcing landscape printing.  I haven't tested IE 
>7b3 to so can't tell you if it supports the @page rule or not.
>
>hth
>
>[1] http://css-discuss.incutio.com/?page=PrintStylesheets
>
>Jim Nannery
>www.redfernenterprises.com
>
>
>__
>css-discuss [EMAIL PROTECTED]
>http://www.css-discuss.org/mailman/listinfo/css-d
>IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
>List wiki/FAQ -- http://css-discuss.incutio.com/
>Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
>  
>
Thanks a lot for the info Jim.

-- 
Eva Vartmann
Web Designer

01273 202 796
www.greenhouse-design.co.uk

Greenhouse Design Ltd
41-43 Portland Road
Hove
East Sussex
BN3 5DQ


The information contained in this email is confidential and may be legally 
priveleged. Except where expressly indicated, it may not necessarily represent 
the views of Greenhouse Design . This email is intended solely for the 
addressee (s) and we ask that any unauthorised recipient advise the sender 
immediately. If you are not the intended recipient any disclosure, copying, 
distribution or any other action taken in reliance on it, is prohibitive and 
may be unlawful.

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] @page and IE6

[Jim Nannery]

Morning Eva

You wrote

> Hi,
>
> I'm trying get a print stylesheet to force the user agent to print a
> page landscape so I'm using:
>
> @page {size:landscape;}
>
> This works fine in Firefox but not IE6. Does anyone have any info on this?
>
> Thank you,
> Eva
>

The CSS-D wiki [1], while a bit dated, has info on this.  IE 6 does not 
support the @page rule for forcing landscape printing.  I haven't tested IE 
7b3 to so can't tell you if it supports the @page rule or not.

hth

[1] http://css-discuss.incutio.com/?page=PrintStylesheets

Jim Nannery
www.redfernenterprises.com


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[Sandra Davis]

--- Gunlaug Sørtun <[EMAIL PROTECTED]> wrote:
> 3: You clearly can't, or won't, test beyond fairly limited
> window-dimensions and conditions, so it's of no use to point out
> avoidable design-weaknesses. They will end up at the user-end no
> matter what.
> 
> The solution is to either live with an "only works as expected in
> some versions of IE" design, add some styling and make it work 
> "somewhat" in most browsers, or to re-think and re-do the entire
> layout in accordance with standards and make it work "more or less"
> everywhere.

Yes, I remember the painful decision to step away from standards
everywhere with this client. It's a kludge at this point. I agree. 

This layout is definitely killing some end user experiences.
Client-insistence is strong in favor for the too dark, line reading
width too long.  Only IE 6 and above, if that. No screen readers...
100% fluid width not consistent. 

No 800px, not even 1024! I butchered a full working standards-template
to get it to this current beauty.

Yes IE jumps... Barely getting just FF & IE addressed. Statistics show
50-50% these 2, with 1% other browser use likely generated from
testing, 1% IE 5 not past 2001.

Definitely at the "work somewhat" stage.

I've now decided to do a major pruning and just go back to a
only-for-FF story board with header-footer, otherwise empty
body/wrapper. I'll post if success. Yes weird on the earlier 
comment, it was a early AM hack for IE, it has to go anyway for even a
minimal degrade to work at this point.

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] @page and IE6

[Eva Vartmann]

Hi,

I'm trying get a print stylesheet to force the user agent to print a 
page landscape so I'm using:

@page {size:landscape;}

This works fine in Firefox but not IE6. Does anyone have any info on this?

Thank you,
Eva

-- 
Eva Vartmann
Web Designer

01273 202 796
www.greenhouse-design.co.uk

Greenhouse Design Ltd
41-43 Portland Road
Hove
East Sussex
BN3 5DQ


The information contained in this email is confidential and may be legally 
priveleged. Except where expressly indicated, it may not necessarily represent 
the views of Greenhouse Design . This email is intended solely for the 
addressee (s) and we ask that any unauthorised recipient advise the sender 
immediately. If you are not the intended recipient any disclosure, copying, 
distribution or any other action taken in reliance on it, is prohibitive and 
may be unlawful.

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] image map in fluid layout and site check please

[Gunlaug Sørtun]

Miki Kersgard wrote:
> I have a map of our state with all of the counties as hotspots and
> need to put them into my (first) fluid layout. Does anyone have an
> idea of how I handle this. Using an old map as a test (much nicer map
> to come) it lost all the linking abilities when made fluid.

Add usemap as reference to image...



...and it'll work just fine.

> page with map: http://www.unc.edu/~kersgard/randr/counties.htm

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Centering text to graphical bullets.

[Zoe M. Gillenwater]

Christy Collins wrote:
> On Aug 11, 2006, at 3:20 PM, Rachel Wright wrote:
>
>   
>> I have an unordered list with graphical bullets and I need to  
>> center the
>> text vertically to the graphical bullets.  How do I do this?
>> 
>
> Something like:
> li{
> background: #fff url(image.gif) no-repeat 45% left;
> }
>
> tweaked to actually center the bullet
>
> see:
> http://css.maxdesign.com.au/listamatic/vertical05.htm
>   

This works if the text is only one line long. If it wraps onto two or 
more lines, the background image is going to be centered in regards to 
the entire height of the list item, which is probably not what you want. 
I recommend using a small em value, like .3em, to nudge your background 
image down and keep it roughly centered with the first line of text no 
matter how many more come after it.

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] image map in fluid layout and site check please

[Miki Kersgard]

I have a map of our state with all of the counties as hotspots and need 
to put them into my (first) fluid layout. Does anyone have an idea of 
how I handle this. Using an old map as a test (much nicer map to come) 
it lost all the linking abilities when made fluid.

Also, if anyone has any suggestions on how to improve the site, please 
let me know.
page with map: http://www.unc.edu/~kersgard/randr/counties.htm
home page: http://www.unc.edu/~kersgard/randr/index.htm
Thanks much,
Miki
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[Gunlaug Sørtun]

Sandra Davis wrote:
>> http://www.keshavhowe.com/7/index.php

> Right - I'm fully aware of this forum and their near constant advice
>  to validate first before posting.
> 
> So I did.

Fine.

FYI: at least some of us can see the difference between what matters and
what doesn't, and you're right: 'technical validation'[1] doesn't help
one bit for your layout-problems.

The fact that you are misusing elements and styling for IE, can't be
picked up by any validator. Almost anything can be made to pass those
validators without being in accordance with standards and without
working as expected. Thus, it's of no use to talk about 'technical
validation' here.


Regarding your centering-problem:

1: IE/win isn't centering anything properly - not before and not now.
It's just jumping between its own bugs and non-standard behavior in ways
no other browser can replicate.

2: Given the same conditions and proper styling: Firefox 1.5.0.6 is
lining up the essential parts like IE6 - minus the annoying jumping and
other IE-bugs. It even makes "the hut" appear at exactly the same
window-width as IE6 does. Same in other browsers.
You have not added the suggested styles, so Firefox isn't given anything
to act on. Firefox doesn't have, and can't replicate, IE's bugs and
non-standard behavior. It needs proper styling.

3: You clearly can't, or won't, test beyond fairly limited
window-dimensions and conditions, so it's of no use to point out
avoidable design-weaknesses. They will end up at the user-end no matter
what.

The solution is to either live with an "only works as expected in some
versions of IE" design, add some styling and make it work "somewhat" in
most browsers, or to re-think and re-do the entire layout in accordance
with standards and make it work "more or less" everywhere.

regards
Georg

[1]http://www.cs.tut.fi/~jkorpela/html/validation.html
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Center-wrap list menu in FF on full width image

[Sandra Davis]

--- francky <[EMAIL PROTECTED]> wrote:
> Sandra Davis wrote:
> 
> >I could use another pair of eyes on this fluid-width design at this
> >point. http://www.keshavhowe.com/7/index.php
> >[...]
> >  
> Hi Sandra,
> Euh, maybe also the eyes of the html-validator can help? ;-)
> html-validator analyse 
>
.

Right - I'm fully aware of this forum and their near constant advice to
validate first before posting.

So I did. 

I validated amap pages before I wrote this forum. The errors remaining
on the pages I'm living with for the moment. For example - that I
declare the same content div id twice in the main page is non-impacting
my issue with the menu in the header. I will address eventually
however. I am aware of the validator and its place in my work product.

> And, oops, the css-validator 
?

Again, the validator report items that are non-impacting to the menu. I
have the menu in separate page files, in separate css files, in
separately named css classes & ids, so it's very easy to focus just on
it's performance without my pulling in every piece of code for the
entire site.

And yes, of course - the validator picked up my IE hacks, my EOT font
use, my hack for opacity, etc. Yet none of my IE hacks are in question
for me in writing this - I'm looking to center in Firefox. 

Sandra

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Safari issue with background images

[Richard Sandilands]

I'm having an issue with Safari not displaying various background  
images.

The site is http://www.smashjobs.com and the issue is intermittent -  
it does not happen in my development environment using lighttpd as a  
server, but only occurs on the remote server.

For instance, at present I can see the background images in the  
header at the above homepage, but not at this page: http:// 
www.smashjobs.com/advertisements/show/16

The xhtml and the CSS validates, although is a little messy in parts.

Any clues would be appreciated.

-- 
Richard Sandilands
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Site Check

[Richard Brown]

Hi Guys

I am building a three column site at:



The middle column seems to be disappearing. Can people see in it in Internet 
Explorer please and if not why is it disappearing please?

Thanks
-- 
Rich
http://www.cregy.co.uk
Embracing what God does for you is the best thing you can do for him.
Romans 12 v 1
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] IE bug? Left-floated nav bar flickers in IE only > Getting IE to show

[francky]

[EMAIL PROTECTED] wrote:

>Thanks, Francky
>
>I don't want to abuse your goodwill, but I am now having problems with my 
>SECOND site. This site looks a lot like the first one, since the two are twin 
>sites and requested an identical look (school site and PTA site). 
>This is an IE issue. The content does not render ("paint") on the page until 
>the user highlights the area with the cursor. Hovering over the area is not 
>enough, you have to click and hold the cursor as if highighting a block of 
>text. This reveals the hidden content in the bodyof the page, and sometimes in 
>the header as well.
>
>I have seen descriptions of this bug somewhere but nothing that seems to apply 
>to my site. Any help will be appreciated.
>
>URL for html page: http://cpotochny.com/ElCarmelo/index.html
>URL for CSS page: http://cpotochny.com/ElCarmelo/ElCarmelo.css
>
>Christine
>
Hi Christine,
First thing I tried was working :-) : add {position: relative}[1] to the 
#Header and the #contentHome: testpage 
.

Greetings,
Francky

Btw: the "Links of Interest" sidebar is peeping out of the page 
background in FF - maybe a {float: right} for the sidebar is better than 
{position:absolute}, which is placing it out of the normal flow. The 
sidebar html can be placed then just after the left-floating 
#navigation, making space for the content in between. The content can 
get a margin-right with some more of the width of the sidebar, to stay 
in it's column. - I hope. ;-)

[1]
More about the {position: relative}fix and other IE troubles/fixes: 
Holly & John's "How To Attack An Internet Explorer (Win) Display Bug" on 
CommMX .

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Sliding door rounded corner boxes

[Pete Home]

Thanks again Francky,

I didn't even think the images were too small! I will look further at your
example soon, but have to move on.

The extra mark-up in the CSS file are for other pages. All pages will have a
menu bar, header and border surrounding the content. The content will either
be split further by using some more of the positioning or like the two
examples so far, just a simple div or two. If you have a look at some of the
other pages on the site (all table based, none of which I coded!) you will
see some of the structures I've started coding the CSS for.

However, the bottom of the two pages so far are still a mess, I cannot use a
single image (customer says so) for the shop div so I tried setting one as a
background image shifted left and the img in the div floated right. However,
the right-hand edge gets pushed out and the background image does not show
at all!

Finally, I have to get the pages working in IE, the customer couldn't give a
damn about standards, they use IE and believe that every one but a few do
(98.6% of all visitors to their site!). But I want to understand the reasons
there are differences and try and make them work in all browsers, even at
the expense of a little more effort.

Regards
Pete 

-Original Message-
From: francky [mailto:[EMAIL PROTECTED] 
Sent: 15 August 2006 04:44
To: [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Sliding door rounded corner boxes

Pete Home wrote:

>I'm getting so frustrated with this. 
>
>I'm assuming that certain TAGs break the flow within this technique 
>therefore interrupting the image outlines causing what looks like 
>breaks in the border for instance.
>
>My site is very standard in layout with basically a top menu, header, 
>content and footer (see www.cityboxer.com/gambling/betting.htm). I want 
>the content to always have a rounded corner border. Francky fixed the 
>problems in FF with this page, so I then replaced the content with a 
>form and saved it as 
>www.cityboxer.com/newsite/contact/contact_form/register_form1.htm) and it
all goes wrong again.
>
>Has anyone used this technique as a template for many other sorts of pages?
>
>Regards
>Pete
>  
>
Aha! Don't give up! Assumption wrong...
I took some screen shots, and yes:

* the corner box has a height of 765px (in resolution 1024x768,
  font-size normal in FF),
* the box_bottomleft.gif and box_bottomright.gif are 700px in height,
* we can see a gap of  65px at the top (for the images are
  positioned at the bottom of the div).
* ;-)

Can be solved in 2 ways:

   1. extending the images in height, for the method is based upon
  images as high as the max. box you need.
   2. using repeated-y images of 1px height for the left and right
  borders (and appropriate css).

This is exactly the reason why I prefer the method 2 template: always
self-adapting, no worry about a new page which can have more height as the
page you developed the "big images" for, - which appear to be not big
enough.
As I said 13-08 (or 08-13):

>> "O, the box is breaking also at large font sizes. I guess because of not
enough height of the box_bottomleft.gif and box_bottomright.gif."

Method 2 is used in my earlier testpage c
.
I used that page (exactly the the same css) to paste a long "form" in
it: testpage d
.
:-)

Greetings,
francky

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Formating Table Columns

[James Denholm-Price]

Hi Anas & [EMAIL PROTECTED] :-)

On 14/08/06, Anas R. <[EMAIL PROTECTED]> wrote:
> I'm trying to give a table colum some special attributs using CSS,

Good use of  but I'm afraid that Firefox (and Opera) are
following the spec. [1] and IE is not, e.g. see [2] which links to a
nice explanation at [3] -- only border, background, width & visibility
can be applied to  and  columns [1].

The css-d wiki [2] suggests some alternatives that you could use, e.g.
combining CSS2 selectors and IE-specific rules.

For forwards compatibility with IE7 [4] you're usually recommended to
use conditional comments to hide the IE-only stylesheet /but/ I've no
idea if IE7 will preserve the ability to apply more than the 4
properties to columns -- anyone?

HTH,
  James

[1] http://www.w3.org/TR/CSS21/tables.html#q4
[2] http://css-discuss.incutio.com/?page=StylingColumns
[3] http://ln.hixie.ch/?start=1070385285&count=1
[4] http://css-discuss.incutio.com/?page=IE7
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/