Re: [css-d] Urgent help required!

[Ingo Chao]

Martin Paton wrote:
 Hi
 
 I have a design review tomorrow PM with a site and I need some urgent
 help getting something to be IE6 compliant.
 
 The pages are:
 
 http://pkl.net/~toasty/site/process_Test.htm
 http://pkl.net/~toasty/site/home.htm
 http://pkl.net/~toasty/site/quality.htm
 
 
 I have no problems with Firefox or Opera, or even IE7 for the most part.
 
 It's just damned IE6. We are not supporting IE5.5, thankfully.
 
 If there's anything you can suggest or help me with I will be eternally
 grateful.
 
 
 Specific problems
 
3 column layout breaks (IE6) - columns aren't right colours, etc.
Menu breaks (IE6)
Banner image header drops on resize (IE6)

Green arrow bullets in centre column don't drop as expected (IE7) -
 right column floats over them.


What timezone you are referring to with tomorrow PM? It's tomorrow pm 
here.

It would be helpful to know what specific problem belongs to what page.

http://pkl.net/~toasty/site/home.htm
   div#sectionA

problem: min-height is not supported in IE6

In your IE6.css, add a
   height:2.5em
to
   #sectionA ul li a
and
   height: 1.5em
to
   #sectionA ul li

Ingo

-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Urgent help required!

[Ingo Chao]

Martin Paton wrote:
 
 http://pkl.net/~toasty/site/process_Test.htm
 http://pkl.net/~toasty/site/home.htm
 http://pkl.net/~toasty/site/quality.htm
 Specific problems
 
3 column layout breaks (IE6) - columns aren't right colours, etc.
Menu breaks (IE6)
Banner image header drops on resize (IE6)

Green arrow bullets in centre column don't drop as expected (IE7) -
 right column floats over them.


Next problem is the wrong background color in the columns,
e.g.

http://pkl.net/~toasty/site/quality.htm

has

div#content.process { }
div#content.quality { }

This is the multiple #id.class bug.
IE does not recognise the second ruleset in this example. Read:
http://css-discuss.incutio.com/?page=InternetExplorerWinBugs
you'll have to rewrite these rules.


For the other problems mentioned in your report, please be more 
specific, thanks.

Ingo

-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Photo-Gallery - missed thumbnails in IE6

[Ingo Chao]

Mauricio Samy Silva wrote:
 Hi,
 Problem occurs at: http://www.maujorsite.com/temp/photo-gallery.html
 Please, load the page in *IE6* and you'll notice that some thumbnails are 
 missed.
 If it loads all the thumbnails at the first time the page is loaded, please 
 hit F5 (or reload the page) sometimes and 
 violá, you will notice that odd issue.
 
 Does anyone knows a fix? and further: Why does it occurs?
 
 TIA
 
 Maurício Samy Silva
 http://www.maujor.com/

Hi Maurício,

I cannot reproduce it here. On reload, the download is delayed for some 
images, but IE6 gets all remaining items after a while.

Does your problem occurs on localhost too?

regards,

Ingo


PS. You should not combine float:left with height:1% in your IE-hacks. 
Probably not an issue here.

-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] floats

[Gary Williamson]

Generator Microsoft Word 11 (filtered medium) Hi 
I' ve recently started to try and make my css fluid using floats and %. 
Everything is fine until I resize the window (make it smaller) and then all 
images on pages drop below the page text! I' ve tried adding a % value to my 
images so they resize with the page but I can' t work out the exact % in order 
to keep the same image resolution. What am I doing wrong? 

Regards
Gary
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Urgent help required!

[Ingo Chao]

Martin Paton wrote:
 ...
 
 http://pkl.net/~toasty/site/process_Test.htm
 http://pkl.net/~toasty/site/home.htm
 http://pkl.net/~toasty/site/quality.htm


Martin Paton wrote offlist:

 Many thanks for the suggestions on the multi ID/class problem.
 
 The other specific problems:
 
 1) IE6 - quality.htm, process_Test.htm
 
 Reducing the browser width causes the right column to become detatched
 from its position and move across the centre column. The correct
 behaviour is observed in Firefox, Opera and IE7.
 
 2) IE6/7 - process_Test.htm
 
 Reducing the browser width causes the right column to float over the
 centre breadcrumb (Stage 1...6). The correct behaviour is observed in
 Firefox and Opera.
 
 3) IE6 - image overflow problem
 
 The top banner image (even though it is not displayed here, but you can
 see the placeholder text) drops underneath the left header (How to win
 at house building) when the browser width is reduced. Again the correct
 behaviour is observed in FF Opera, IE7. 

Martin,
please reply-all when answering to the list, and always include the links.

1) partly related to 2) at least in process_Test.htm

2) Add a haslayout trigger to #content, e.g.
zoom:1;

3) I am not sure how to fix it. This does not happen on
http://pkl.net/~toasty/site/quality.htm


Ingo
-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Photo-Gallery - missed thumbnails in IE6

[Mauricio Samy Silva]

- Original Message - 
 Mauricio Samy Silva wrote:
 Hi,
 Problem occurs at: http://www.maujorsite.com/temp/photo-gallery.html
 Please, load the page in *IE6* and you'll notice that some thumbnails are 
 missed.
 If it loads all the thumbnails at the first time the page is loaded, 
 please hit F5 (or reload the page) sometimes and violá, you will notice 
 that odd issue.

 Does anyone knows a fix? and further: Why does it occurs?

 TIA

 Maurício Samy Silva
 http://www.maujor.com/



 Hi Maurício,

Hi Ingo

 I cannot reproduce it here. On reload, the download is delayed for some 
 images, but IE6 gets all remaining items after a while.

This is the behavior here too.

 Does your problem occurs on localhost too?

Yes it do.

 PS. You should not combine float:left with height:1% in your IE-hacks. 
 Probably not an issue here.
 http://www.satzansatz.de/css.html

Tks for pointing it out 

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 6 help please

[Phil Turner]

Hi everyone I need some help with this page
Ive produced a gallery using a series of thumbnails with a .class  
instead of a series of #divs

I'm not sure if this was the right approach as it is causing a  
problem in IE 6
can someone help me fix the problem or shall I re- design using divs?

Second problem in IE 6   Ive created two divs #emailgraphic and  
#phonegraphic  the text and images inside these divs both have  
a .class applied to them.
Something is throwing the spacing out of wack

Any help appreciated on these IE issues

http://www.philturner-uk.com/phil/portfolio.html




Phil Turner
FREELANCE DESIGNER
TEL: 0161 439 1669
Chartered Graphic Designer MCSD  BA Hons
[EMAIL PROTECTED]
http://www.philturner-uk.com

NEW BOOK - YOUR PLANET NEEDS YOU
http://www.yourplanetneedsyou.org

P Please consider the environment before printing this email.



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Hover not working with IE 6

[Jody Cleveland]

Hello,

I've got a website here: http://beta.menashalibrary.org/childrens/authors

In Safari, IE7, Firefox, Opera, if you mouse over the animals at the top,
you see text below it. In IE6, it does not. I've been spending days on this,
and it's killing me. Any ideas as to what the issue with IE6 is, or how I
can fix it?

Here's the css for the area:

td .info {
display: none;
width: 445px;
height: 18px;
background: transparent
url('/sites/beta.menashalibrary.org/themes/kids/img/textbox-all.png')
no-repeat 0px 0px;
}
#menu-cow:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -445px 0;
}
#menu-dog:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -890px 0;
}
#menu-elephant:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -1335px 0;
}
#menu-frog:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -1780px 0;
}
#menu-giraffe:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -2225px 0;
}
#menu-lizard:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -2670px 0;
}
#menu-lion:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -3115px 0;
}
#menu-pig:hover .info {
display: inline;
position: absolute;
width: 445px;
top: 48px;
left: 337px;
background-position: -3560px 0;
}

Thank you so much for your time.

- jody

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Bugs in IE6

[Luca Candela]

Hi everybody, I'm new to CSS design and I need a little help. I solved 
most of the IE6 related bugs (even if in a not-so-stylish way) but I 
can't figure out the solution for the last two

1) The navigation bar has an :hover background in Firefox, but IE6 fails 
to show it.

http://luckymethod.1majorhost.com/index.html

2) The contact page shows a gap between the navigation bar and the grey 
area with the content. How can I fix that?

http://luckymethod.1majorhost.com/ITA/contacts.html

how's the code and the page, overall, any suggestion to make it better?


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Drop down menu z-index problem in IE7

[Brendan Hastings]

Hi,






I am having a problem with a drop down menu in IE7 - basically the
drop-down menu opens up behind hrefs here is an example of this - the
images are links.


http://www.dam.ie/investment.html




Also here: http://lwww.dam.ie/intermediaries.php if you hover over the about 
us tab ou can see one of the links is over the key people section of the menu.


The annoying thing is that it even works in IE6!!


I have been messing around with z-indexes etc. for days now with regard to this 
problem but have not been able to fix this. Any suggestions would be great.

Thanks

Brendan





___ 
What kind of emailer are you? Find out today - get a free analysis of your 
email personality. Take the quiz at the Yahoo! Mail Championship. 
http://uk.rd.yahoo.com/evt=44106/*http://mail.yahoo.net/uk 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] CSS-only hover menu obscured by other elements in IE 6

[grovesdavid]

David Wilson wrote:

 Unfortunately, in IE 6 the menu
 for the top images is hidden by the images below

Hi,

If I didn't know better I would say this was a windowed object problem.

Though I thought only form, flash or pictures where classed as windowed 
objects in IE xxx.

If it turns out to be that problem then you have to use JavaScript, I know.

Spent ages getting Son of Suckerfish to work, only to scrap it when I ran 
into this problem.

Best Of Luck

David G)
-- 

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] My layout breaks in IE6 and 7

[Josue Martinez]

Hello, everyone. I am working on a website and want to get the layout ready
before I continue to make dreamweaver templates based on the index page.
Here's a little info about the html code before I get into my problems:

I have 3 container divs. Why so many? The first one, called bodybg, has
the shadow background. I didn't apply it to the body element because
otherwise the layout would break if someone made their browser window small
enough. The second one, called extradiv, contains the blue abstract bg.
The third one, container, acts as the real container for the rest of the
elements.

As I already mentioned, the layout breaks in IE7. It's easier if you just
look at it, assuming you have the browser. Here's the URL, followed by the
css code. I want to take it a step at a time, but I'll point out that, as a
comment explains, removing the top border from the masthead will shift the
whole site down in most browsers. Also, I hope to optimize my CSS, but
that'll come later. Thank you very much for your help

http://www.ic.sunysb.edu/clubs/phiota/test/



/*--CSS FILE--*/

/*basic elements-*/

body {
text-align: center;
color: black;
background-color: white;
margin: 0;
padding: 0;
}
div#bodybg {
background: transparent url(assets/images/container_shadow.gif) 50% 0 
repeat-y;

width: 890px;
margin: -1px auto 0 auto;
position: relative;
/*border: 1px solid black;  
/*delete after troubleshooting*/
}
#extradiv {
background: transparent url(assets/images/abstract_bg.gif) 50% 0 
no-repeat;

width: 880px;
margin: 0 auto;
/*border: 1px solid silver; 
/*delete after troubleshooting*/
}
#masthead {
width: 606px;
height: 125px;
padding: 0;
margin: 0;
background: white url(assets/images/banner.jpg);

border-top: 1px solid black;/*If I 
remove the border, the
masthead is pushed down except in IE6 WIN*/
}
#masthead span {
display: none;
}
ol#nav {
list-style: none;
margin: 126px 0 0 0;

padding: 0;
height: 20px;
background-color: black;
color: white;
font-size: 11px;
}
ol#nav li {
background-color: black;
color: white;
text-align: left;
float: left;
width: 95px;

height: 20px;
border-right: 1px solid white;
margin: 0;
padding: 0 0 0 5px;
font-size: 11px;
}
ol#nav li.first {
width: 100px;
}
ol#nav li:hover {
background-color: red;
}

ol#nav li a {
display: block;
font: 11px Trebuchet MS, Helvetica, Arial, Tahoma, Verdana, 
sans-serif;
font-weight: bold;
text-decoration: none;
color: white;
letter-spacing: .1em;
}

h1, h2 {
font-family: Georgia, Times New Roman, Times, serif;
font-weight: normal;
font-size: 18px;
}
p {
font: 10pt/1.4 Trebuchet MS, Helvetica, Arial, Tahoma, Verdana, 
sans-serif;

}
#footer {
background: black;
clear: both;
color: white;
padding: 3px 0;
}
#footer p {
font-size: 8pt;
padding: 5px;
}
/*Positioning--*/

#container {
/*background: white url(assets/images/temp_bg.gif) repeat-y; */
text-align: left;
position: relative;
width: 606px;
margin: 0 auto 0 auto;
/*border: 1px solid yellow; 
/*delete after troubleshooting*/

}
#rightside {
width: 390px;
margin: 50px 5px 20px 207px;
padding: 0 0 0 5px;
/*border: 1px solid red;
/*delete after troubleshooting*/
}
#sidebar {
position: absolute;
width: 192px;

margin: 50px 0 0 5px;
/*border: 1px solid red;
/*delete after troubleshooting*/
}

/*Should be taken out of global list and applied to specific
page--*/
div#sidebar h2#news {

font: bold 12px/1.2 Trebuchet MS, Helvetica, Arial, Tahoma,
Verdana, sans-serif;
text-align: center;
background-color: yellow;
border: 1px solid black;
border-bottom: none;
margin-bottom: -1px;

padding: 1px 0;
}
div#sidebar ol#newsitems {
background: white url(assets/images/stripes.gif);
list-style: none;
margin: 0;
padding: 0;
border: 1px solid black;
 

[css-d] div 1px wide

[Ross]

I just want to create a 1px verical line. Is there a way to make divs 1px wide? 
Seem to be a minimum of 5-10px depending on browser.



Any other methods apart from bg images welcome.



Ross
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] My layout breaks in IE6 and 7

[Ian Young]

 From: [EMAIL PROTECTED]
 [mailto:[EMAIL PROTECTED] Behalf Of Josue Martinez
 Sent: 27 June 2007 12:22
 To: css
 Subject: [css-d] My layout breaks in IE6 and 7


 Hello, everyone. I am working on a website and want to get the
 layout ready
 before I continue to make dreamweaver templates based on the index page.
 Here's a little info about the html code before I get into my problems:

 I have 3 container divs. Why so many? The first one, called bodybg, has
 the shadow background. I didn't apply it to the body element because
 otherwise the layout would break if someone made their browser
 window small
 enough. The second one, called extradiv, contains the blue abstract bg.
 The third one, container, acts as the real container for the rest of the
 elements.

 As I already mentioned, the layout breaks in IE7. It's easier if you just
 look at it, assuming you have the browser. Here's the URL, followed by the
 css code. I want to take it a step at a time, but I'll point out
 that, as a
 comment explains, removing the top border from the masthead will shift the
 whole site down in most browsers. Also, I hope to optimize my CSS, but
 that'll come later. Thank you very much for your help

 http://www.ic.sunysb.edu/clubs/phiota/test/



I haven't looked at the code, but as a general rule, don't use borders to
test your layout -something that Zoe pointed out to me early on in the
piece. Use background colours for testing.
You have a couple of errors in your code, one of which may cause you a
problem. Go fix that first:
http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.ic.sunysb.edu%2
Fclubs%2Fphiota%2Ftest%2F

Cheers

Ian
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.476 / Virus Database: 269.9.10/873 - Release Date: 26/06/2007
23:54

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 1px wide

[Ian Young]

 -Original Message-
 From: [EMAIL PROTECTED]
 [mailto:[EMAIL PROTECTED] Behalf Of Ross
 Sent: 27 June 2007 12:29
 To: css-d@lists.css-discuss.org
 Subject: [css-d] div 1px wide


 I just want to create a 1px verical line. Is there a way to make
 divs 1px wide? Seem to be a minimum of 5-10px depending on browser.



 Any other methods apart from bg images welcome.


Hi Ross

You could just use margin-left or right. I have used this to good effect to
replace a vertical image

Ian
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.476 / Virus Database: 269.9.10/873 - Release Date: 26/06/2007
23:54

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] floats

[David Laakso]

Gary Williamson wrote:
 Generator Microsoft Word 11 (filtered medium) Hi 
 I' ve recently started to try and make my css fluid using floats and %. 
 Everything is fine until I resize the window (make it smaller) and then all 
 images on pages drop below the page text! I' ve tried adding a % value to my 
 images so they resize with the page but I can' t work out the exact % in 
 order to keep the same image resolution. What am I doing wrong? 

 Regards
 Gary
   


Gary,

Without a clickable link to your page or a test case page, it really is 
impossible to offer a solution-- there are often too many variables for 
one solution to fit every layout. Adding a percent width to the images 
may compound the issue. Try setting the width and height of the image in 
pixels.  Sometimes adding 'max-width: 96%;' helps if the problem is in 
compliant browsers. For IE it gets more tricky. Try adding 'overflow-x: 
hidden;' to the selector that is the immediate parent (container) of the 
image (s) .
Best,
~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 6 help please

[David Laakso]

Phil Turner wrote:
 Hi everyone I need some help with this page
 Ive produced a gallery using a series of thumbnails with a .class  
 instead of a series of #divs



 http://www.philturner-uk.com/phil/portfolio.html




 Phil Turner
   

There are something like 150+ markup validation errors. Use Tidy On-line 
[1] to clean the file. Or better, strip the javascript and call it from 
external files. Then use Tidy On-line to clean the html. Once that is 
done validate the markup [2] and css [3] with the w3c validation 
service. Bring it back a valid file to the list and someone will help 
de-bug it for IE6.

[1] http://infohound.net/tidy/
[2] http://validator.w3.org/
[3] http://jigsaw.w3.org/css-validator/

Best,
~dL




-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Hover not working with IE 6

[Ingo Chao]

Jody Cleveland wrote:
 Hello,
 
 I've got a website here: http://beta.menashalibrary.org/childrens/authors
 
 ...
 
 td .info {
 display: none;
 width: 445px;
 height: 18px;
 background: transparent
 url('/sites/beta.menashalibrary.org/themes/kids/img/textbox-all.png')
 no-repeat 0px 0px;
 }
 #menu-cow:hover .info {
 display: inline;
 position: absolute;
 width: 445px;
 top: 48px;
 left: 337px;
 background-position: -445px 0;
 }


Jody,

IE6 does not support :hover on elements other than links.

You could add this behavior with a script 
http://www.xs4all.nl/~peterned/csshover.html

Or you would have to rearrange your html

Instead of:

td id=menu-cow
   a href=...
 img ...
   /a
   span class=infonbsp;/span
/td

rearrange to:

td
   a id=menu-cow href=...
 img name=cow ...
 span class=infonbsp;/span
   /a
/td

In addition, IE6 needs a little reminder to actually do something on hover:
#menu-cow:hover {background-position: 0 0;}

Ingo

-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] gradient shadow not covering float

[Elli Vizcaino]

I see it extending all the way to the right. But what
you encounter is the light background behind the curve
of the corner images that are in that top box. If you
can make that part of your image transparent or matach
it up to the gradient then that might solve your
problem.

Elli 


--- Bruce Gilbert [EMAIL PROTECTED] wrote:

 hello,
 
 on my test page here:
 
 http://www.mellonaidftp.com/ssri/test.php
 
 there is a gradient that starts below where the big
 brown image place holder
 is, where you see the breadcrumb links and
 printer/email a friend icons.
 This gradient needs to extend all the way to the
 right behind the third
 column where you see the latest news/upcoming
 events/Meet the Team boxes.
 but the gradient is stopping in front of that div.
 
 I thought it might be a float clearing issue so I
 added the CSS found here:

http://www.positioniseverything.net/easyclearing.html
 
 and applied class=clearfix to the divs involved,
 but this doesn't seem to
 fix the problem. The gradient still does not
 continue behind the
 'InformationColumn' div.
 
 any suggestions?
 
 the full CSS is here:
 
 http://www.mellonaidftp.com/ssri/CSS/main.css
 
 thanks in advance!
 
 -- 
 ::Bruce::

__
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7 information --
 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/
 


My Sites:
www.jadynteal.com
www.eliazer.com
www.e7flux.com


   

Be a better Heartthrob. Get better relationship answers from someone who knows. 
Yahoo! Answers - Check it out. 
http://answers.yahoo.com/dir/?link=listsid=396545433
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] I cant get list style - help!

[Susan Grossman]

If you try  #navlist li.active { margin: 0 0 0 20px;list-style-type:square }
(as an example) you'll see that the squares are there - you just need
margins on both the UL and the LI so you can see them

HTH - Susan




 I would like square bullets on my left hand menu but just cant get it to
 do it. I added this style to the style sheet  #navlist .subnavlist
 {list-style-type: square;} and that didn't do it. If anyone can help I
 would be very grateful.



 Mandy



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Drop down menu z-index problem in IE7

[Ingo Chao]

Brendan Hastings wrote:
 ...
 I am having a problem with a drop down menu in IE7 - basically the
 drop-down menu opens up behind hrefs here is an example of this - the
 images are links.
 
 
 http://www.dam.ie/investment.html

z-index:1 on ul#menubar should fix that.

position:relative without z-index erroneously performs a stacking 
context in IE.

Ingo

--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Best way for text when enlarged

[trevor bayliss]

Hi David and all,
 Sorry I put up the wrong link
  http://216.219.94.105/indextest.cfm
   
  I am playing around with all the great pointers I have been given. There seem 
to be a lot fo different opinions on this one so I will always be doing it 
wrong in somebody´s eyes I suppose! 
  Re-writing: David I am going to have a crack at implementing your 5 col 
layout and see how I go with that. 
   
  Thanks everybody 

 
-
Don't get soaked.  Take a quick peak at the forecast 
 with theYahoo! Search weather shortcut.
 
-
Finding fabulous fares is fun.
Let Yahoo! FareChase search your favorite travel sites to find flight and hotel 
bargains.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Drop down menu z-index problem in IE7

[Brendan Hastings]

Hi Ingo, Thanks so much! That seems to have worked!

- Original Message 
From: Ingo Chao [EMAIL PROTECTED]
To: Brendan Hastings [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Sent: Wednesday, 27 June, 2007 3:30:25 PM
Subject: Re: [css-d] Drop down menu z-index problem in IE7

Brendan Hastings wrote:
 ...
 I am having a problem with a drop down menu in IE7 - basically the
 drop-down menu opens up behind hrefs here is an example of this - the
 images are links.
 
 
 http://www.dam.ie/investment.html

z-index:1 on ul#menubar should fix that.

position:relative without z-index erroneously performs a stacking 
context in IE.

Ingo

--
http://www.satzansatz.de/css.html







  ___
Yahoo! Answers - Got a question? Someone out there knows the answer. Try it
now.
http://uk.answers.yahoo.com/ 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Best way for text when enlarged

[David Laakso]

trevor bayliss wrote:
 Hi David and all,
Sorry I put up the wrong link
 http://216.219.94.105/indextest.cfm
  
 I am playing around with all the great pointers I have been given. 
 There seem to be a lot fo different opinions on this one so I will 
 always be doing it wrong in somebody´s eyes I suppose!
 Re-writing: David I am going to have a crack at implementing your 5 
 col layout and see how I go with that.
  
 Thanks everybody



It is getting the software, even Internet Explorer, to cooperate with 
the needs and demands of users that is important. Opinions vary on how 
to accomplish this, and there is nothing wrong in that.

Try to hold  at least a +2 font scaling in compliant browsers, and  at 
text-size largest in IE  in accessibility mode with the ignore 
font-sizes box checked. At those settings, with the primary content 
text set at default,  the floats should not drop, the footer should 
clear, and the text should not overlap.

Your current layout is not meeting that criteria.
This might clear the footer:
#footer_home {
bottom: 10px; --delete
position: absolute; --delete
text-align: center;
width: 850px;
margin-left: 40px;
color: #666
}
And tweaking the font-sizes will help with the cross-overlap of the text.
Someone else can deal with the float drop and other issues in IE.

The layout I put up was nothing to write home about. But it did resolve 
most all of the above issues.

Best,

~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 1px wide

[Josue Martinez]

Use borders to create rulers. You can use padding to push the border
farther from its element.

On 6/27/07, Ross [EMAIL PROTECTED] wrote:
 I just want to create a 1px verical line. Is there a way to make divs 1px 
 wide? Seem to be a minimum of 5-10px depending on browser.



 Any other methods apart from bg images welcome.



 Ross
 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7 information -- 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-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] CSS-only hover menu obscured by other elements in IE 6

[Holly Bergevin]

From: David Wilson [EMAIL PROTECTED]

I'm trying to make a javascript-free hover menu for some images 

in IE 6 the menu
for the top images is hidden by the images below. I've tried setting
the menu's and images' z-indexes, and while this works in firefox it
has no effect in IE 6.

http://devshare.rsd.co.za/leftboxdiscuss.html

The z-index of a parent element that displays a hover behavior must be higher 
than the z-index of a following parent element, in order for IE6 to get the 
stacking order right. While you have added a z-index, it's not on the correct 
element.

I have put up a page for you to look at [1], rather than just give you the 
solution here, because your HTML page is poorly formed and I wanted to make 
sure my suggestion would work with what you have in a proper setting. 
Briefly, you page has no doctype or charset, and the style element exists 
outside of the head element. 

I'm not sure what all those conditional comments are doing hanging around 
(other than apparently writing improperly nested elements for the IE browsers) 
but I didn't change them. I guess that's one way to solve problems.

[1] http://members.dslextreme.com/users/cssjedi/css-d/hover-test.html

I hope that this information helps,

~holly 
 
   
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Bugs in IE6

[Josue Martinez]

1. Google whatever hover so you can d/l the behavior that gives IE6
the ability to do things on hover, as it's limited to :hover on the a
element by default.

On 6/26/07, Luca Candela [EMAIL PROTECTED] wrote:
 Hi everybody, I'm new to CSS design and I need a little help. I solved
 most of the IE6 related bugs (even if in a not-so-stylish way) but I
 can't figure out the solution for the last two

 1) The navigation bar has an :hover background in Firefox, but IE6 fails
 to show it.

 http://luckymethod.1majorhost.com/index.html

 2) The contact page shows a gap between the navigation bar and the grey
 area with the content. How can I fix that?

 http://luckymethod.1majorhost.com/ITA/contacts.html

 how's the code and the page, overall, any suggestion to make it better?


 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7 information -- 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-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] ID vs Class

[Travis Killen]

Why should class be used to define an element vs. id?  I'm sure each one 
should be used in different situations, and would like more information 
on making the right choice.  Do child elements inherit properties from 
there parent class?  from there parent id?  Any links to information on 
this topic would be much appreciated.

Kind Regards,
Travis Killen
936 Web Design
http://936webdesign.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] ID vs Class

[Marcus Taylor]

Technically, ids should only be declared once in a page, and classes can be
repeated as many times as necessary. So I would declare page structure with
ids and elements within as classes. If you have a button (for example) that
is repeated many times in a page use a class.

If you use Tidy (I use Safari Tidy) and repeat an id in a page it'll throw
up a warning.

There's more info here...

http://creativebits.org/webdev/div_id_vs_div_class

 Why should class be used to define an element vs. id?  I'm sure each one
 should be used in different situations, and would like more information
 on making the right choice.  Do child elements inherit properties from
 there parent class?  from there parent id?  Any links to information on
 this topic would be much appreciated.
 
 Kind Regards,
 Travis Killen
 936 Web Design
 http://936webdesign.com


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] ID vs Class

[James Gadrow]

Travis Killen wrote:
 Why should class be used to define an element vs. id?  
You use ids for unique page elements.

ie:

id=contentWrapper
id=mainNav
id=inbox

You use classes for styling similar elements.

ie:

class=externalLink
class=topItem
class=message

However, you only need an id / class where there's no other way to 
distinguish an item. If you only have 1 form under contentWrapper you 
don't need to give it an id / class too.

hth

-- 
Thanks,

Jim

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] ID vs Class

[john saylor]

hi

On 6/27/07, Travis Killen [EMAIL PROTECTED] wrote:
 Why should class be used to define an element vs. id?

http://www.w3.org/TR/REC-CSS2/selector.html#id-selectors

 Any links to information on
 this topic would be much appreciated.

http://www.w3.org/TR/REC-CSS2/cover.html#minitoc

-- 
\js  [ http://or8.net/~johns/ ]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 in IE Please

[Richard Brown]

Hi

On 26/06/07, Richard Brown [EMAIL PROTECTED] wrote:
 Could someone take a quick look at this site in IE please? I think the
 third column is dropping below the 1st. Is that correct?
 http://www.familywealthdifference.com/blog/
 http://familywealthdifference.com/blog/wp-content/themes/FWPItheme2/style.css

I thought I had fixed this but it still seems wrong in WinIE 5.5. Can
somebody take a look again for me 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
IE7 information -- 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] Best way for text when enlarged

[Jason Crosse]

Shark Attack Design wrote:
 I wonder what proportion of web users ever bother to adjust the default text 
 size of their browser(s)? The preset default size is generally 16 (I think 
 Safari is different?) although I'm not sure what the units are for that 
 default -- pixels? Points?

It's been discussed fairly recently on this list. The 16px default size is 
based on text being 12pt high on a 96dpi screen. Now, many new PCs are being 
dispatched with 120dpi or higher pre-configured so on those machines 16px will 
not be the default: it will be bigger. 

Also, now many mobile devices with small screens are accessing the web, and 
their default pixel size is unlikely to be 16px. 

-- 
http://antanova.blogspot.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Best way for text when enlarged

[Susan Grossman]

As an FYI - I sent out a survey at my last position to state workers who
used computers for specific tasks and personal use and this was one of the
questions.  Out of 67 responses back, no one had ever changed the default
font size or their default resolution.   A very small study, but
interesting.



  I wonder what proportion of web users ever bother to adjust the default
 text size of their browser(s)?
 http://antanova.blogspot.com
 __




-- 
Susan R. Grossman
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 in IE Please

[David Laakso]

Richard Brown wrote:
 Hi

 On 26/06/07, Richard Brown [EMAIL PROTECTED] wrote:
   
 Could someone take a quick look at this site in IE please? I think the
 third column is dropping below the 1st. Is that correct?
 http://www.familywealthdifference.com/blog/
 http://familywealthdifference.com/blog/wp-content/themes/FWPItheme2/style.css

 
 I thought I had fixed this but it still seems wrong in WinIE 5.5. Can
 somebody take a look again for me please?

 Thanks.
   


It is not working in /any/ version of win/IE. And it is a wonder that it 
is working in any browser at all. Among other things, see line 185: move 
the html element head into the correct section of the document


Best,
~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Layout question

[Shelly]

Hey all -

I'm hoping that all I need is a fresh set of eyes here.  I'm trying to 
accomplish a layout that I'm having a *slight* issue with.  I can 
*almost* get it exactly how I want it, but almost means no cigar.

So, here's a small graphic of what it should look like:

http://anekostudios.com/test/ex.jpg

At first, it seems simple enough: a 2 column fluid layout, left and 
right at 50% width and 100% height each, and staying that way no matter 
how you resize the browser.

But the thing is, I have some interesting attributes added to this that 
are making it difficult to accomplish: the gradient background between 
the two columns, the striped gradient that overlays the right, and the 
no-repeat background on the left.

On their own, I can do many of these things.  For example, for the 
gradient on the right, I would set the plain striped background as the 
div background, and then have another div (100% in width and 600px 
height with a z-index of 0) that would hold the gradient, so if the 
browser is resized the solid will fill out the bottom area.  But the 
drop shadow is what's getting me - I can't seem to work that in with the 
multiple layers.

As I said, I *almost* have it using some rather unorthodox methods (that 
I haven't had a chance to check in multiple browsers yet, and it'll 
probably fall apart you-know-where, but I'm keeping my fingers crossed) 
- but these methods seem to show that the html and body have a 
difference of about 21% at the bottom - meaning my striped background 
cuts off leaving quite a bit of white space beneath it, instead of 
stretching to 100% in height.

My eyes are going blind from trying little things to see if they work, 
and I was wondering if some secondary input might not help me out here. 
  I've tried so many variations on the theme that supplying you all with 
one example of what I've done is just to little to go on - so instead, I 
was hoping someone could offer up an idea on how *you* would do this.

For the record, content will be in both sides, the the left will hold a 
small navigation menu, a logo and a small flash animation (for aesthetic 
purposes only - it's just pretty stuff, nothing important).

So am I trying to do something absolutely insane here, or is this 
possible to do?  I'd appreciate any insight you all may have for me :)

~Shelly
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 in IE Please

[Richard Brown]

Hi David

On 27/06/07, David Laakso [EMAIL PROTECTED] wrote:
  Could someone take a quick look at this site in IE please? I think the
  third column is dropping below the 1st. Is that correct?
  http://www.familywealthdifference.com/blog/
  http://familywealthdifference.com/blog/wp-content/themes/FWPItheme2/style.css
 
 
  I thought I had fixed this but it still seems wrong in WinIE 5.5. Can
  somebody take a look again for me please?
 
Thank you so much David. I was working off a version on my server and
passing the code to the client to upload. I hadn't spotted her adding
this stuff.
-- 
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
IE7 information -- 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] Layout question

[Elli Vizcaino]

It would help if I could see the actual HTML/CSS. 
Do you have links you can point to?

Elli 

--- Shelly [EMAIL PROTECTED] wrote:

 Hey all -
 
 I'm hoping that all I need is a fresh set of eyes
 here.  I'm trying to 
 accomplish a layout that I'm having a *slight* issue
 with.  I can 
 *almost* get it exactly how I want it, but almost
 means no cigar.
 
 So, here's a small graphic of what it should look
 like:
 
 http://anekostudios.com/test/ex.jpg
 
 At first, it seems simple enough: a 2 column fluid
 layout, left and 
 right at 50% width and 100% height each, and staying
 that way no matter 
 how you resize the browser.
 
 But the thing is, I have some interesting attributes
 added to this that 
 are making it difficult to accomplish: the gradient
 background between 
 the two columns, the striped gradient that overlays
 the right, and the 
 no-repeat background on the left.
 
 On their own, I can do many of these things.  For
 example, for the 
 gradient on the right, I would set the plain striped
 background as the 
 div background, and then have another div (100% in
 width and 600px 
 height with a z-index of 0) that would hold the
 gradient, so if the 
 browser is resized the solid will fill out the
 bottom area.  But the 
 drop shadow is what's getting me - I can't seem to
 work that in with the 
 multiple layers.
 
 As I said, I *almost* have it using some rather
 unorthodox methods (that 
 I haven't had a chance to check in multiple browsers
 yet, and it'll 
 probably fall apart you-know-where, but I'm keeping
 my fingers crossed) 
 - but these methods seem to show that the html and
 body have a 
 difference of about 21% at the bottom - meaning my
 striped background 
 cuts off leaving quite a bit of white space beneath
 it, instead of 
 stretching to 100% in height.
 
 My eyes are going blind from trying little things to
 see if they work, 
 and I was wondering if some secondary input might
 not help me out here. 
   I've tried so many variations on the theme that
 supplying you all with 
 one example of what I've done is just to little to
 go on - so instead, I 
 was hoping someone could offer up an idea on how
 *you* would do this.
 
 For the record, content will be in both sides, the
 the left will hold a 
 small navigation menu, a logo and a small flash
 animation (for aesthetic 
 purposes only - it's just pretty stuff, nothing
 important).
 
 So am I trying to do something absolutely insane
 here, or is this 
 possible to do?  I'd appreciate any insight you all
 may have for me :)
 
 ~Shelly

__
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7 information --
 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/
 


My Sites:
www.jadynteal.com
www.eliazer.com
www.e7flux.com


   

Got a little couch potato? 
Check out fun summer activities for kids.
http://search.yahoo.com/search?fr=oni_on_mailp=summer+activities+for+kidscs=bz
 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 Woes!!! Help please.

[Luc]

 Good afternoon list,

 http://www.dzinelabs.com/projects/MP/Pages/metalicanav

 Css: http://www.dzinelabs.com/projects/MP/Styles/metallicanav.css

 Works in the good browsers but in IE 6  7 the nav and thumbgallery
 breaks apart. Any thoughts on what is causing this?
 
-- 
Best regards,
 Luc



Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

You are traveling through another dimension, a dimension not only of
sight and sound but of mind. A journey into a wondrous land of
imagination. Next stop, the Twilight Zone!


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] question on nesting elements inside a for hover effect.

[Ray Leventhal]

Hi all,

I've run into a *very* minor (and wholly non-critical) issue for which
I'm hoping there's a quick solution.

URL: http://www.cprtools.net/localfeed/headcombs-test.php
CSS: http://www.cprtools.net/localfeed/prodfeed.css

Issue: This page now validates XHTML 1.0 Strict and CSS, but the hovers
aren't as I originally intended.

Each of the items listed were, initally, all wrapped in a single a
href, but validation failed because p elements are invalid inside an a.

So, to be compliant, each of the p and img elements have their own
a href.  The effect I was looking for was for the text hover effect to
take place when one moused-over the image for that product. 

As I said, a minor issue, but I was hoping there was a more experienced
person than I who might have had similar experiences and has found a
solution.  This is an adjunct page to a site that is wholly
un-compliant.  That rework will be ponderous, but is already in
development thanks to the efforts of everyone who posts stuff here :)

Thanks to all in advance,

~Ray

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] css elastic images in firefox and styled links active area issue

[brandon meyer]

Hello, 

I am having 2 separate issues with my CSS that I will list in order. I would 
really appreciate any help I can get. The test site is located at: 
http://www.therainforestsolution.com/new_index.html

1.) I've been working the last couple hours attempting to fix the weird way my 
links are behaving within my main navigation menu after they are styled. I 
found the guilty lines in my css that are conspiring against me, namely, my ul 
{ margin-top: -60px; } and the ul a { line-height: 30px;}. With the active, 
clickable area completely dependent on the line-height area the problem is that 
neither is willing to respond by moving along with the text and negative 
top-margin. Mad!

So, as I move the text in the navmenu up with the negative margin, the 
clickable area is reduced. The only relationship the active area (line-height) 
and the negative top-margin has is the text. Only the text that is within the 
apparently unmovable line-height area is clickable so with a -15px top-margin 
for example, only half of the text is clickable because the top half is outside 
of the clickable-area, and a -60px, which is where I want it, is completely 
outside of the unmovable line-height clickable area.

I thought to enlarge the line-height to something like 75px but it creates a 
huge blank space below the navigation menu. 

2.) I ran into an issue with my floated liquid images around the same time I 
went back and added the margins (also in percentages), even though I was 
careful not to go over 100% width (removing the margins again doesn't fix 
anything so this is just conjecture). The problem only occurs in Mozilla and 
doesn’t occur in IE6. 

It seems when I shrink the browser window in mozilla after a certain point the 
liquid images pop into their full size and are no longer liquid unless I 
maximize the browser window and hit refresh. The paragraphs take up the entire 
width of the div and the images, at their full dimensions, drop below the 
paragraphs. I have all the css for this on my linked CSS document.

Thanks,
-B
http://www.therainforestsolution.com/new_index.html
   
-
Be a better Globetrotter. Get better travel answers from someone who knows.
Yahoo! Answers - Check it out.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Background Image Position Problems--Do You Have a Work Around?

[Fabienne]

Hello, all. I am creating a Zen Cart for my store and  have put an image 
in the background of my pages. The webpage is found here: 
http://www.possets.com/zen-cart and the CSS can be found here. 
http://www.possets.com/zen-cart/includes/templates/magic/css/stylesheet.css 

In some browsers, the image looks great. In other browsers the 
background images are drifting up too high and show the bottom being cut 
off and it's unattractive. I have been just positioning the image 
downward in the past but that is a bad solution because it makes the 
image look bad in some browsers. My main troubles are in IE5, 5.5, and 6 
and Safari. It appears to look just fine in IE 7 Firefox. I want to be 
able to position the image in the background and have it look good in 
IE6, 5.5, and 5 at least, so the image bottom sits on or below the 
bottom of the page.

I am using Firefox 2.0.0.4 and I do my coding in TopStyle Pro (so all 
mistakes are mine and I cannot blame them on any other source). I have 
my screen res set at 1024 x 768 (because it seem like a popular size). 
Thanks for any help you have on this cross browser vexation.
-- Fabienne Christenson My Website: http://www.possets.com 
__ 
css-discuss [EMAIL PROTECTED] 
http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 
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/

-- 
Fabienne Christenson
My Website: http://www.possets.com

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] ID vs Class

[Zoe M. Gillenwater]

Travis Killen wrote:
 Why should class be used to define an element vs. id?  I'm sure each one 
 should be used in different situations, and would like more information 
 on making the right choice.  Do child elements inherit properties from 
 there parent class?  from there parent id?  Any links to information on 
 this topic would be much appreciated.
   

Travis,

We have a page on it in our wiki:
http://css-discuss.incutio.com/?page=ClassesVsIds

A quick reminder, while we're talking: To start a new thread, do not 
reply to an existing message. When you do this, your message gets 
threaded on to the old thread, which messes up the archives and makes it 
less likely that others will see your message and subsequently reply to 
you. You must send a new message with an appropriate and descriptive 
subject line to css-d@lists.css-discuss.org in order to start a new thread.

Thanks,
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
IE7 information -- 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] Layout question

[Shelly]

 It would help if I could see the actual HTML/CSS.
Do you have links you can point to?

That's the thing - this is a flat graphic mockup. I'm trying to figure 
out the best way to code it in CSS.  I've tried several different ways 
(just initial attempts - no real meat), but I think I need another set 
of eyes to try it out.

In other words - no real HTML yet.  I'm asking for opinions/ideas on how 
you all would go about doing it if this were given to you to code out.

~Shelly
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] question on nesting elements inside a for hover effect.

[Luc]

Good afternoon Ray, 
It was foretold that on 27/6/2007 @ 14:45:38 GMT-0400 (which was
15:45:38 where I live) Ray Leventhal would write:

snipped a bit

 So, to be compliant, each of the p and img elements have their own
 a href.  The effect I was looking for was for the text hover effect to
 take place when one moused-over the image for that product.   

Is this what you're looking for? If you replace the text Rollover
with an image, the text appears.

http://www.dzinelabs.com/Raycsslist

Css is embedded.

Basically the rollover text is inside a span element, and this element
itself  is  inside an a element. You need to make the span element
appear, only when the a element is in the hover state.
 
-- 
Best regards,
 Luc
_

Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

When you set yourself on fire, people love to come and see you burn
- John Wesley. 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[David Hucklesby]

On Tue, 26 Jun 2007 19:13:23 -0300, Luc wrote:
 Good evening list,

 i have a nav menu that uses a class called active to indicate the current 
 page. The
 class uses a background image but i can't seem to set the distance between 
 the image
 and the links. I've been experimenting with both margins and padding but to 
 no avail.

 It's been puzzling me to death.

 page:

 http://www.dzinelabs.com/projects/MP/Pages/metalica

 css:

 http://www.dzinelabs.com/projects/MP/Styles/metallica.css

 Here's how it should look like:
 http://www.dzinelabs.com/projects/MP/Pages/werkendvoorbeeldcsslist2

~

It's puzzling me, too. Your linked page looks nothing at all like the 
reference page this end. So I am not sure what to fix, exactly.

Here's how it looks in Firefox:

http://webwiz.robinshosting.com/images/metalica.png

(Same in Opera.)

Cordially,
David
--

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Background Image Position Problems--Do You Have a Work Around?

[L Lay]

Fabienne wrote:
 Hello, all. I am creating a Zen Cart for my store and  have put an image 
 in the background of my pages. The webpage is found here: 
 http://www.possets.com/zen-cart and the CSS can be found here. 
 http://www.possets.com/zen-cart/includes/templates/magic/css/stylesheet.css 

 In some browsers, the image looks great. In other browsers the 
 background images are drifting up too high and show the bottom being cut 
 off and it's unattractive.  I want to be 
 able to position the image in the background and have it look good in 
 IE6, 5.5, and 5 at least, so the image bottom sits on or below the 
 bottom of the page.


   
Try

background:#FF url(../images/possetsgirl800w.jpg) no-repeat fixed 
left bottom;

or

background:#FF url(../images/possetsgirl800w.jpg) no-repeat fixed  0 
100%;


This will fix the background to the bottom of the viewport, which might 
be below the bottom of the page at higher resolutions.  When you use 
fixed units like pixels, the top left of the image is put at that point 
in the containing box, which is basically the viewport in your case.  
But if you use percentages, a point in the image at the specified 
percentages is matched to the same point in the containing box.  So, for 
example, if you specify 10% 20% as the percentages, a point 10% across 
and 20% down in the image is matched to the point 10% across and 20% 
down in the containing box.

You might try playing with percentages as well to see if they provide 
the effect you want.  Setting the horizontal percentage (the first 
value) to 50% will centre the image in the containing box.

HTH

Lori
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 in IE Please

[Richard Brown]

Hi All

On 27/06/07, Richard Brown [EMAIL PROTECTED] wrote:
 On 27/06/07, David Laakso [EMAIL PROTECTED] wrote:
   Could someone take a quick look at this site in IE please? I think the
   third column is dropping below the 1st. Is that correct?
   http://www.familywealthdifference.com/blog/
   http://familywealthdifference.com/blog/wp-content/themes/FWPItheme2/style.css
  
Could you please take a look at this site:
http://blog.cregy.co.uk/
http://blog.cregy.co.uk/wp-content/themes/emily/style.css
This is the site where the code was originally built. I would just
like to know whether this works in WinIE 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
IE7 information -- 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] positioning

[Terry Hamel]

I'm having trouble positioning divs.  There are two major parts of
this page - the immovable header and the movable content.  The header
contains a logo on the left, a subtitle in the center (left aligned to
the logo), and a search bar on the right.

Besides this, the content div only goes down as far as the content.
I'd like it to fill the viewport even when there is little content.

This website is internal and will only be viewed on Firefox browsers.
I've convinced the corporation that IE is bad for business, except in
certain cases where they need to view a website that is designed for
IE, which is few if any.

The URL: http://four.fsphost.com/thpublic/

The CSS:

* {margin: 0; padding: 0;}

html, body, {
width: 100%;
height: 100%;
font: 0.8125em Verdana, sans-serif;
line-height: 1;
color: rgb(244, 242, 219);
background-color: rgb(30, 23, 14);
}



#header {
background-color: #1E170E;
border-bottom-style: solid;
border-bottom-width: 5px;
padding: 10px;
background-color: rgb(30, 23, 14);
background-image: url(layout/gradient-dark1.jpg);
background-repeat: repeat-x;
color: white;
position: fixed;
height: 7em;
top: 0;
width: 100%;
}

#logo  {
position: relative;
   float: left;
}

#header p {
font-family: Courier New,Courier,monospace;
font-weight: bold;
font-size: 1em;
letter-spacing: .25em;
padding: 1em;
}

#search {
width: 5em;
background-color: rgb(80, 71, 65);
font-size: 0.5em;
}

fieldset { width: 5em; }

#content {
font: 0.8125em Verdana, sans-serif;
background-color: rgb(30, 23, 14);
color: rgb(244, 242, 219);
margin-top: 10em;
padding-top: 10px;
}


.companyname1,
.companyname2 {
color: rgb(255, 255, 255);
font-style: normal;
font-family: Times New Roman,Times,serif;
text-align: center;
line-height: .75em;
}

.companyname1 {
font-size: 2em;
font-weight: bold;
}

.companyname2 {
font-size: .75em;
font-weight: normal;
}






The HTML:

body
div id=wrapper
div id=header

div id=logo
h1 class=companyname1companyname1br/span
class=companyname2companyname2/span/h1
/div

psubtitle/p

div id=search
fieldset
input id=searchInput type=text /
button id=performSearchsearch/button
/fieldset
/div
/div!--header--

div id=content
Content or table
/div
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[Luc]

Good evening David, 
It was foretold that on 27/6/2007 @ 14:17:42 GMT-0700 (which was
18:17:42 where I live) David Hucklesby would write:

snipped a bit

 Here's how it looks in Firefox:

 http://webwiz.robinshosting.com/images/metalica.png

Strange, at my end in opera, moz and FF the borders etc stretch to the
bottom of the page.

 
-- 
Best regards,
 Luc
_

http://www.dzinelabs.com

Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera. 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[L Lay]

Luc wrote:
 Good evening David, 
 It was foretold that on 27/6/2007 @ 14:17:42 GMT-0700 (which was
 18:17:42 where I live) David Hucklesby would write:

 snipped a bit

   
 Here's how it looks in Firefox:
 

   
 http://webwiz.robinshosting.com/images/metalica.png
 

 Strange, at my end in opera, moz and FF the borders etc stretch to the
 bottom of the page.

  
   
They don't on a high res monitor.  They stop well above the bottom of 
the viewport.

Also, can you isolate the effect you're trying to achieve?  The 
navigation links look the same on your reference page and the new one, 
so we're not sure what you are trying to fix.  The active class has a 
-2em left margin that pulls the link text over, so it's working the way 
you have coded it.  If you're referring to the missing arrow, that's 
being overridden by the a:link definition, so you have a specificity 
problem.  You'll have to remove the negative left margin or the arrow 
will overlap the text.

Have a look at the elements in Firebug http://www.getfirebug.com/ and 
you'll see the applied styles, and which styles are being overridden.  
You can also temporarily disable styles to see the effect, like 
disabling the background on a:link to make the arrow show up...

Lori

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] [NAGW] Re: Here it is with formatting:

[Stan Baptista]

David,

 Respectfully, getElementById() does use the name property if the id property 
 is not assigned, at least in IE.

mea culpa. You're correct about IE, should have double-checked first.
FF (at least 2.0.0.4) doesn't have this enhancement.

I took a look at MSDN to see what might be spec'd for the method:
(http://msdn2.microsoft.com/en-us/library/ms536437.aspx)

It appears that it's *supposed* to use ids (no mention of names) but,
what the heck.

The W3C DOM Level 3 Core Spec
(http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-getElBId) also
indicates that the method uses ids although if more than one element
has an ID attribute with that value, what is returned is undefined.

Undefined includes names, I guess;-)

Thanks for pointing this out,

-Stan
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[Luc]

Good evening Lori,
It was foretold that on 27/6/2007 @ 19:35:54 GMT-0400 (which was
20:35:54 where I live) Lori Lay would write:

snipped a bit

 They don't on a high res monitor.

My res is 1440x900. Any idea what's causing this?

 Also, can you isolate the effect you're trying to achieve?

On the reference page there is a distance between the arrow and the
text, while on the new one i can't get any space i.o.w. the arrow sits
where it should be but i can't seem to push the text of the links
further away from it. (Hope it makes sense)

  The active class has a
 -2em left margin that pulls the link text over, so it's working the way
 you have coded it.
  If you're referring to the missing arrow, that's
 being overridden by the a:link definition, so you have a specificity 
 problem.  You'll have to remove the negative left margin or the arrow 
 will overlap the text.

if i leave the negative out, the arrow and text goes 2 em to the
right, hence i tried to fix it with the negative margin.

 Have a look at the elements in Firebug http://www.getfirebug.com/

Tnx, i'll give it a try.

 
-- 
Best regards,
 Luc
_

http://www.dzinelabs.com

Powered by The Bat! version 3.99.3 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
IE7 information -- 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] List problem

[L Lay]

Luc wrote:
 Good evening Lori,
 It was foretold that on 27/6/2007 @ 19:35:54 GMT-0400 (which was
 20:35:54 where I live) Lori Lay would write:

 snipped a bit
 They don't on a high res monitor.
   

 My res is 1440x900. Any idea what's causing this?
   

I think it's just that your viewport is sized such that the content 
seems to expand to fill it.  My monitor is 1920x1200, so my viewport is 
large enough that the content stops before the bottom.  I wouldn't worry 
about it.  Maybe just put a bottom border on your wrapper so that it 
looks closed off.
 Also, can you isolate the effect you're trying to achieve?
 

 On the reference page there is a distance between the arrow and the
 text, while on the new one i can't get any space i.o.w. the arrow sits
 where it should be but i can't seem to push the text of the links
 further away from it. (Hope it makes sense)

   
In the reference page, the arrow is a background on the list items, 
whereas in your new page it's on the anchor.  Perhaps you should move it 
back to the list items.  Otherwise, use negative positioning on the 
background to pull it over.

That would be something like:

background:transparent url(../Images/activenav.jpg) no-repeat scroll -5px 0;


To be honest, I'm not sure if you can use ems for background positioning 
or not.  You can certainly use percentages but I'm not sure about ems.

  The active class has a
 -2em left margin that pulls the link text over, so it's working the way
 you have coded it.
  If you're referring to the missing arrow, that's
 being overridden by the a:link definition, so you have a specificity 
 problem.  You'll have to remove the negative left margin or the arrow 
 will overlap the text.
 

 if i leave the negative out, the arrow and text goes 2 em to the
 right, hence i tried to fix it with the negative margin.
   
   
 Have a look at the elements in Firebug http://www.getfirebug.com/
 

 Tnx, i'll give it a try.

   
It makes all this much easier.  You can try temporarily applying styles 
and see what the effect is immediately.

Lori

PS Please include the list in replies.  Someone else may want to jump in 
or see your comments.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[Luc]

Good evening Lori,
It was foretold that on 27/6/2007 @ 19:35:54 GMT-0400 (which was
20:35:54 where I live) Lori Lay would write:

snipped a bit

 The active class has a 
 -2em left margin that pulls the link text over, so it's working the way
 you have coded it.  If you're referring to the missing arrow, that's 
 being overridden by the a:link definition, so you have a specificity 
 problem.  You'll have to remove the negative left margin or the arrow 
 will overlap the text.
 Have a look at the elements in Firebug

Well  it's  fixed  now:  the  background  on  the  a:link  was  set on
transparent,  so  i removed it and the arrow showed up. I also removed
the  margin  and  padding  styles  on  the  active  class  and changed
padding-leftand   margin-left   on   the   #navcontainer   a:link,
#navcontainer a:visited, #navcontainer a:hover, #navcontainer a:active
styles ... all tnx to firebug and your suggestion!

Still puzzles me why the borders etc don't stretch all the way down???

 
-- 
Best regards,
 Luc
_


Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

People will pay more to be entertained than educated. - Johnny
Carson. 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] positioning

[L Lay]

Terry Hamel wrote:
 I'm having trouble positioning divs.  There are two major parts of
 this page - the immovable header and the movable content.  The header
 contains a logo on the left, a subtitle in the center (left aligned to
 the logo), and a search bar on the right.

 Besides this, the content div only goes down as far as the content.
 I'd like it to fill the viewport even when there is little content.

 This website is internal and will only be viewed on Firefox browsers.
 I've convinced the corporation that IE is bad for business, except in
 certain cases where they need to view a website that is designed for
 IE, which is few if any.

 The URL: http://four.fsphost.com/thpublic/

 The CSS:

 * {margin: 0; padding: 0;}

 html, body, {
   width: 100%;
   height: 100%;
   font: 0.8125em Verdana, sans-serif;
   line-height: 1;
   color: rgb(244, 242, 219);
   background-color: rgb(30, 23, 14);
   }

   
You have a comma after body which is means that the entire rule is being 
ignored.  See Firefox's error console for this CSS error and some JS 
errors.  You can add a min-height:  100% to your content division to 
make it as tall as the viewport.  However, I don't think it will look 
like it unless you put a repeating background image on your content 
division, even if it is a solid colour.  That's the premise behind the 
faux columns http://alistapart.com/articles/fauxcolumns/ method, if I 
understood it correctly :-)

Lori
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[L Lay]

Luc wrote:
 Good evening Lori,
 It was foretold that on 27/6/2007 @ 19:35:54 GMT-0400 (which was
 20:35:54 where I live) Lori Lay would write:

 snipped a bit

 Still puzzles me why the borders etc don't stretch all the way down???
   

Because the content will only be as tall as it needs to be.  Getting the 
content to stretch all the way down requires a bit of messing around 
with min-heights in FF and lots of other convolutions to get it to work 
in IE.  See my other post with the subject of positioning (same time 
as yours) for some comments about that.

If you really want to look into that, have a look at 
http://pmob.co.uk/.  Paul seems to have the most info on 100% height 
layouts.

And pardon my comment about including the list - your email is weird :-) 
and I didn't see that it was actually going to the list.

Lori
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] List problem

[Luc]

Good evening Lori,
It was foretold that on 27/6/2007 @ 21:03:23 GMT-0400 (which was
22:03:23 where I live) Lori Lay would write:

snipped a bit

 Because the content will only be as tall as it needs to be.  Getting the
 content to stretch all the way down requires a bit of messing around 
 with min-heights in FF and lots of other convolutions to get it to work 
 in IE.

Hmm, i was thinking it had something to do with teh clearing floats
problem as described on http://www.positioniseverything.net/easyclearing.html


 See my other post with the subject of positioning (same time 
 as yours) for some comments about that.

Well, the leftcontent has an image as background that i used, based
upon the fauxcolumns method.

 I  wouldn't  worry  about it. Maybe just put a bottom border on your
 wrapper so that it looks closed off.

I'll give that a try tomorrow ... maybe you could send me a screenshot
to see how it looks like then? (if it's not to much to asked)

 And pardon my comment about including the list - your email is weird :-)
 and I didn't see that it was actually going to the list.

No offense taken, it's just the way my reply template is set up
all the posts goes directly to the list :-)

 
-- 
Best regards,
 Luc
_

Powered by The Bat! version 3.99.3 with Windows XP (build 2600),
version 5.1 Service Pack 2 and using the best browser: Opera.

Youth would be an ideal state if it came a little later in life. -
Herbert Henry Asquith 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] can anyone see my content disappearing - IE6 win SP2

[kristin]

i am told that on the wine pages   contact page:
 
http://www.tuttobenewines.com/contact.html
http://www.tuttobenewines.com/wines-rosso.html
http://www.tuttobenewines.com/wines-bianco.html
 
i have a disappearing content bug in IE6 win SP2.
 
I cannot for the life of me recreate it - despite seeming to have the same
environment, so i'm am having difficulty fixing it.  Any guideance would be
greatly appreciated,
 
thank you so much,
kristin
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Best way for text when enlarged

[david]

Please don't top post!

Susan Grossman wrote:
 As an FYI - I sent out a survey at my last position to state workers who
 used computers for specific tasks and personal use and this was one of the
 questions.  Out of 67 responses back, no one had ever changed the default
 font size or their default resolution.   A very small study, but
 interesting.
 
 I wonder what proportion of web users ever bother to adjust the default
 text size of their browser(s)?
 http://antanova.blogspot.com

did you make a distinction between work and home computers? My limited
experience with government computers is that many of them are so locked
down that the users CAN'T change their font size or resolution or
anything else about the display - even if they want to.

A corollary to this is that many users also have no control over whether
or not Javascript is turned on ...

-- 
David
[EMAIL PROTECTED]
authenticity, honesty, community

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Best way for text when enlarged

[david]

Jason Crosse wrote:
 Shark Attack Design wrote:
 I wonder what proportion of web users ever bother to adjust the default text 
 size of their browser(s)? The preset default size is generally 16 (I think 
 Safari is different?) although I'm not sure what the units are for that 
 default -- pixels? Points?
 
 It's been discussed fairly recently on this list. The 16px default size is 
 based on text being 12pt high on a 96dpi screen. Now, many new PCs are being 
 dispatched with 120dpi or higher pre-configured so on those machines 16px 
 will not be the default: it will be bigger. 
 
 Also, now many mobile devices with small screens are accessing the web, and 
 their default pixel size is unlikely to be 16px. 

I saw a report mentioned a few years ago saying that (1) the majority of
web surfing in Japan is done via cell phone, and (2) analysts expect
Europe to go the same way. Considering that that was a few years ago,
Europe may already be doing the majority of its web surfing via mobile
devices, too.

Only the US lags behind, courtesy of our pathetic excuses for cell phone
service providers ...

-- 
David
[EMAIL PROTECTED]
authenticity, honesty, community

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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/