Re: [css-d] Trouble with table cell/row heights, rowspans IE.

2008-02-03 Thread Jukka K. Korpela
Emil Björklund wrote:

 I'm having major problems with applying height rules to a table. I
 know setting heights for table cells or rows is tricky at best, but I
 so need this to work, soon *losing hair*

It's tricky topic indeed.

 An example page is up at http://ebdesign.se/table_problem.html, with
 an accompaying sketch of what it's supposed to look like (if you use
 IE) at http://ebdesign.se/table_problem.gif

The problem is that when a table has, say, three rows that should have a 
specific total height (determined by an image in this case) and you 
would like to set specific heights for two of them and let the browser 
allocate the rest to the third row, IE just won't do this. It applies 
its own obscure layout algorithms.

As a workaround, you could use nested tables, so that on the right of 
the image, you have just a single cell. Within that cell, you would have 
an inner table, aligned to the top of the enclosing cell. In your 
example, this would be a 2 by 2 table. The rest of the content of the 
enclosing cell would be empty, with no need for any artificial 
construct. But the structure as a whole would be somewhat illogical, 
since the columns of the inner table should relate to the columns of the 
outer cell but they don't, in the markup. The presentational 
manifestation of this problem is that they wouldn't by nature share the 
outer table's column widths. This could be fixed by using fixed (e.g., 
px valued) width settings for them. This means inflexibility, but you 
seem to be using fixed widths anyway.

Another, simpler approach would mean fixing the heights as well. This 
means that you set the heights of the rows in pixels, or estimate them 
in pixels (making a guess on what em typically is in pixels, multiplying 
it by the line height, and adding the (defaulted) cell padding) and then 
set the height of the dummy cell in pixels so that the sum of the 
heights matches the height of the image cell. This too implies 
inflexibility, but your table as a whole isn't very flexible anyway.

Jukka K. Korpela (Yucca)
http://www.cs.tut.fi/~jkorpela/ 

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


[css-d] Where does the large gap come from please?

2008-02-03 Thread Richard Brown
Hi

I have puzzled over the css for days and tried experimenting with
different layouts and still find a large gap appearing. See this site:
http://cornwallfineart.co.uk/paintings/?antcat=1product=2
CSS:
http://cornwallfineart.co.uk/wp-content/themes/uzella/style.css

The gap exists between the header Beatiful2: and the description. I
have tried varying the styling here:
http://macintoshantiques.com/antique-gallery/?antcat=11product=11
CSS:
http://macintoshantiques.com/wp-content/themes/grey/style.css

But even though it doesn't look like it, the gap is still there.

Any ideas please? Thanks.
-- 
Kind regards
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
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Where does the large gap come from please?

2008-02-03 Thread Matthew Taylor
Hi Rich,

In both cases it appears that a br/ is the problem. This br/ is adding 
more than one line of space because it is between two block-level elements 
(a heading and a parragraph) that have vertical margins. The total space 
created is one line break from the br/ plus the bottom margin of the above 
heading, plus the top margin of the parragraph below. This adds up to about 
3 lines not the expected 1. Without the br/ the upper and lower margins 
collapse together leaving about 1 line of space.

If you want to add an extra line of space below the heading then just 
increase the bottom margin on this heading instead of adding the br/, that 
should do it.

I hope that helps.

- Matt =)


Matthew James Taylor
http://matthewjamestaylor.com



 Hi

 I have puzzled over the css for days and tried experimenting with
 different layouts and still find a large gap appearing. See this site:
 http://cornwallfineart.co.uk/paintings/?antcat=1product=2
 CSS:
 http://cornwallfineart.co.uk/wp-content/themes/uzella/style.css

 The gap exists between the header Beatiful2: and the description. I
 have tried varying the styling here:
 http://macintoshantiques.com/antique-gallery/?antcat=11product=11
 CSS:
 http://macintoshantiques.com/wp-content/themes/grey/style.css

 But even though it doesn't look like it, the gap is still there.

 Any ideas please? Thanks.
 -- 
 Kind regards
 Rich
 http://www.cregy.co.uk

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


Re: [css-d] Trouble with table cell/row heights, rowspans IE.

2008-02-03 Thread Gunlaug Sørtun
Emil Björklund wrote:

 http://ebdesign.se/table_problem.html

 Most browsers I've tested in so far (FF2 Mac/Win, Safari 3 Mac, Opera
  9 Mac) shows the intended layout. IE6-7 though, shows the article 
 no./finish columns expanded to fill the height of the space to the 
 right of the image. I cannot for the life of me get them to respect 
 any height measurement.

Wish I could say I've solved the problem, but I've only added parts of a
workaround for the test case, that may or may not provide you
with enough bits for solving a real case...

http://www.gunlaug.no/tos/alien/eb/test_08_0203.html

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


Re: [css-d] Trouble with table cell/row heights, rowspans IE.

2008-02-03 Thread Emil Björklund
Thanks for the input, Georg!

Wish I could say I've solved the problem, but I've only added parts of a
 workaround for the test case, that may or may not provide you
 with enough bits for solving a real case...


I've also thought about having the image float, but in my limited tests so
far, problems arise when there is more than one model in the table (probably
should've mentioned that there could be several models in the problem
description). I'll test some more though...

Any further input would be greatly appreciated.

Thanks again,

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


Re: [css-d] Trouble with table cell/row heights, rowspans IE.

2008-02-03 Thread Emil Björklund
Hi Mathew.

I think the problem is due to the way you are laying out this design. In my
 view it's not semantically correct to be using tables. Instead, for each
 product model I would make two columns using divs, one for the pictures
 the
 other for the info.


I see where you're coming from, but I actually very much see this as tabular
data.
It has headings for each column and repeating chunks of information related
to the headings etc.
I probably should've mentioned that there can be several models in the
table, too. Also, unfortunately, the design/layout
is not for me to change, I just convert it to html/css...

If I mark it up as divs + a dl for the articles, I lose the relationship
between the column headings and the data, the drawing and the rest of the
model info etc...
So I would very much define this as a table. But thath's not to say that I
haven't considered converting it into a more simple but less semantically
meaningful markup. ;-)

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


[css-d] another site check please...

2008-02-03 Thread Rob freeman
At the moment the site is in a subdirectory so when you click back to
home you may end up in the current site (Old). Please feel free to
have a look, feedback welcome. This is still in work in progress mode,
but I want to check for browser compatibility.

There is a min height command on some of the pages (as the client
couldn't supply any more copy).

I have tested this in Firefox 2.0 (Mac and PC), Safari (Mac) and Opera (Mac).
Also this has been validated for xhtml, though the CSS flagged up
unsupoorted Min Height for Safari 2.0?? Not sure what I can do about
that..

Here is the Link
http://www.coloursense.net/testfolder/


Thanks...

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


Re: [css-d] Where does the large gap come from please?

2008-02-03 Thread Richard Brown
Hi Matt

On 03/02/2008, Matthew Taylor [EMAIL PROTECTED] wrote:

 In both cases it appears that a br/ is the problem. This br/ is adding
 more than one line of space because it is between two block-level elements
 (a heading and a parragraph) that have vertical margins. The total space
 created is one line break from the br/ plus the bottom margin of the above
 heading, plus the top margin of the parragraph below. This adds up to about
 3 lines not the expected 1. Without the br/ the upper and lower margins
 collapse together leaving about 1 line of space.

Thanks for the help. For all the looking I couldn't see the br /!
Rather anoying.
-- 
Kind regards
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
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] multiple dropdowns on same page

2008-02-03 Thread Cheryl Amato
I have a page that needs to use the son of suckerfish dropdowns in 2 locations. 
I am also implementing the javascript that makes them keyboard accessible. In 
FF and IE7, the 2nd set of drop downs work although not from the keyboard. In 
IE6, they don't work at all. Can someone please take a look and see if they can 
see the problem?

Bear in mind I have no control over either the design or site architecture. 
This is what I have to work with. Any help will be greatly appreciated.

The page can be viewed at http://www.cherylamato.com/mhcc/

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


Re: [css-d] multiple dropdowns on same page

2008-02-03 Thread Ingo Chao
Cheryl Amato wrote:
 I have a page that needs to use the son of suckerfish dropdowns in 2
 locations. I am also implementing the javascript that makes them
 keyboard accessible. In FF and IE7, the 2nd set of drop downs work
 although not from the keyboard. In IE6, they don't work at all. Can
 someone please take a look and see if they can see the problem?
 
 ...
 
 The page can be viewed at http://www.cherylamato.com/mhcc/


The first navigation has an id=nav.
The second one does not.
Your scripts are looking for an element with the id=nav.


The first script emulates a sort of hover for IE6 and below.

sfHover = function() {
var sfEls = document.getElementById(nav).getElementsByTagName(LI);
...
So the second navigation does not work.


The second script seems to make it keyboard accessible

mcAccessible = function() {
  var mcEls = document.getElementById(nav).getElementsByTagName(A);
...
But again, the second navigation has nothing to do with it.


Do you have a CSS question? ;)

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


Re: [css-d] multiple dropdowns on same page

2008-02-03 Thread David Laakso
Cheryl Amato wrote:
 I have a page that needs to use the son of suckerfish dropdowns in 2 
 locations. I am also implementing the javascript that makes them keyboard 
 accessible. In FF and IE7, the 2nd set of drop downs work although not from 
 the keyboard. In IE6, they don't work at all. Can someone please take a look 
 and see if they can see the problem?

 Bear in mind I have no control over either the design or site architecture. 
 This is what I have to work with. Any help will be greatly appreciated.

 The page can be viewed at http://www.cherylamato.com/mhcc/

 TIA
 Cheryl
   


That's a tough one. I am afraid I can offer little more than compassion. 
But, FWIW, I had relative luck [1] with a single item drop down in IE 
using this method [2], but have never tried setting it in two different 
locations on the same page. And also luck with TJK's [3], keyboard 
friendly (and considerably more complicated), drop down in IE. I have 
yet to have any success with the suckerfish, and gave up trying long ago.


[1] http://www.chelseacreekstudio.com/ca/cssd/un/
[2] http://sperling.com/examples/menuv/
[3] 
http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/default.asp

-- 
http://chelseacreekstudio.com/

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


Re: [css-d] css menu text misplaced

2008-02-03 Thread Ingo Chao
Shanna Korby wrote:
 The text in each link is at the top of the 'box'. How do I move the text 
 down without moving the a:focus background?
 
 http://korbyimagery.com/ab/

Did not test it in IE, but setting a line-height of 30px on li or a 
should move the text down, at least in Firefox.

Ingo

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


Re: [css-d] Three column variable width columns with padding

2008-02-03 Thread Aaron Gray
Hi Matthew,

 Hi Aaron,

 I have made a quick layout for you based on my 'Perfect 3 column liquid
 layout'. Here is the link:

 http://matthewjamestaylor.com/blog/perfect-3-column-thirds.htm

 Let me know how you go.

Thanks, okay I have whitled it down a bit to the essentials :-

http://www.aarongray.org/Examples/CSS/ThreeColumnVariableWidthColumns.html

The CSS it totally weird, how did you derive it ?

Aaron


 - Matt =)

 Matthew James Taylor
 http://matthewjamestaylor.com



 - Original Message - 
 From: Aaron Gray [EMAIL PROTECTED]
 To: css-d@lists.css-discuss.org
 Sent: Saturday, February 02, 2008 7:30 AM
 Subject: spam: [css-d] Three column variable width columns with padding


 Hi,

 I am after a format that has three variable with columns of 33% with
 padding on either side of each column.

 Many thanks in advance,

 Aaron
 

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


Re: [css-d] multiple dropdowns on same page

2008-02-03 Thread Cheryl Amato
Cheryl Amato wrote:
 I have a page that needs to use the son of suckerfish dropdowns in 2 
 locations. I am also implementing the javascript that makes them keyboard 
 accessible

Ingo Chao wrote:
The first navigation has an id=nav.
The second one does not...


It seems the problem was in the javascript, not the csds. I find that if I add 
another set of functions using the id mainnav everything works fine. Not the 
most elegant solution but it does work. And this mess is only on the homepage. 
I will continue to work on the javascript to condense it.

Thanks.

Cheryl

Thanks for pointing me to where the error was.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] Noob with float/div problems

2008-02-03 Thread Ken Davies
It just sunk in, thanks
Ken
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] Noob with float/div problems

2008-02-03 Thread Ken Davies
Hello Arlen.
You wrote CSS for what I was hoping to accomplish
#banner { padding: 3px; text-align: center; width: 858px; height:  
53px; border: 3px double black;}
#banner img { float: right; }
#banner img#logo { float: left; }
#banner p { margin: 0; padding: 0; font-weight: bold; font-size: 110%;}
I will be trying to see what this does with some adjustments, thanks but please 
clarify
you show #banner each line. Is there a reason other than MY future reference?
Also if reference in a stylesheet is to an img should that preface the #name-ie 
img#name.
Thanks
Ken

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


[css-d] Crashing IE7 with CSS a.k.a. IE7 doesn't like button[value]

2008-02-03 Thread Antonio Bueno
Hello, all.

A few days ago, while testing for coherence in a webpage, IE7 crashed on me.
I've isolated the offending code here:
http://www.mundoplus.tv/atnbueno/ie7crash.html

After a few tests (actually, a lot of them) I've found it's simply more of
IE lack of support for the button tag. No CSS applied to button[value] is
shown, and any value for value crashes (closes down) the current IE
window. So remember, don't style with the button[value] selector.

The problem is understandable. I mean, button came out with HTML 4.0 in
1997 and MS still hasn't been able to make it work correctly [1]. How can we
expect to be able to add CSS to it? :D

On Monday I'm adding a Using IE7? Don't click here link to my homepage :D
:D :D


[1] http://www.peterbe.com/plog/button-tag-in-IE
-- 
Regards,
 Antonio

http://www.mundoplus.tv/
Televisión por satélite en España
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] padding problems in IE6

2008-02-03 Thread Juli Zanocco
Hello,

I have put together a photo collection based on the tutorial in More  
Eric Meyer on CSS.  So it should work, right?  Well it does in  
Safari 3.0 and Firefox  2.0(mac) but in IE6 the padding seems to be  
off.  The individual divs for each image are behaving correctly but  
the images inside each div are off center to the left while the  
titles for each image (in the same div) are off center to the right.   
Actually, the title problem shows up in all browsers - i just used a  
negative left margin to center it - but even that doesn't work in  
IE.  Is it my math or IE weirdness?

Here are the relevant links:
http://www.newmoonfarm.net/albumFarm.html
http://www.newmoonfarm.net/CssFiles/nmf08.css

And a little problem with FireFox:
On this page:  http://www.newmoonfarm.net/Farm-pages/Image2.html
I have arrow gifs used as background images in paragraph tags.   
Safari and Explorer (even IE5mac) expand the block to encompass the  
gifs but Firefox does not.  I've had to add a bunch of nbsp's to get  
the gifs to show.  What am I doing wrong here?

The styles for these pages are labeled Photo Album styles on the  
style sheet.

Thank you all so much for being willing to help beginners like me.

  Regards,

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


Re: [css-d] padding problems in IE6

2008-02-03 Thread Gunlaug Sørtun
Juli Zanocco wrote:
 Hello,
 
 I have put together a photo collection based on the tutorial in More
  Eric Meyer on CSS.  So it should work, right?  Well it does in 
 Safari 3.0 and Firefox  2.0(mac) but in IE6 the padding seems to be 
 off.  The individual divs for each image are behaving correctly but 
 the images inside each div are off center to the left while the 
 titles for each image (in the same div) are off center to the right. 
 Actually, the title problem shows up in all browsers - i just used a 
 negative left margin to center it - but even that doesn't work in IE.
 Is it my math or IE weirdness?

 http://www.newmoonfarm.net/albumFarm.html

It's More IE weirdness :-)

Adding...

.pic {overflow-x: hidden;}

...will fix it by killing IE6' auto-expansion bug.

The addition of...

.pic ul {padding: 0!important;}

...will correct the title and probably remove the cause for
auto-expansion.

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


[css-d] Background in IE doesn't appear..

2008-02-03 Thread John Leishman
The below snip works in FF  Opera to provide a graded background. IE 
ignores it and provides a white background only.

Appreciate any hints as to cause here as it's slowly driving me nuts

Thanks

John

ps appears at http://www.32sss.org.au


html, body {

font-size:18px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:normal;
margin:0;
padding:1%;
background: 
url(http://www.32smallshipsqn.org.au/Graphics/grade.jpg)repeat-x top left;

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


Re: [css-d] Stylesheet just for Safari

2008-02-03 Thread Nancy E. Sosna Bohm
 ...Safari is displaying a tag differently than Firefox.  How would you
embed a separate style sheet for Safari into a webpage?
 ...

The body:first-of-type hack works, for example:

#leftmenu {position:absolute;top:189px; left:50px;}
body:first-of-type #leftmenu {top:187px;}

(The second line is read only by Safari.)

But after I went through my code a few more times I wound up not needing it.

Nancy

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


Re: [css-d] Background in IE doesn't appear..

2008-02-03 Thread David Laakso
John Leishman wrote:
 The below snip works in FF  Opera to provide a graded background. IE 
 ignores it and provides a white background only.

 Appreciate any hints as to cause here as it's slowly driving me nuts

 Thanks

 John

 ps appears at http://www.32sss.org.au


 html, body {

 font-size:18px;
 font-size-adjust:none;
 font-stretch:normal;
 font-style:normal;
 font-variant:normal;
 font-weight:bold;
 line-height:normal;
 margin:0;
 padding:1%;
 background: 
 url(http://www.32smallshipsqn.org.au/Graphics/grade.jpg)repeat-x top left;

 }
   


In the last rule, in the above ruleset, leave a space between -- )repeat --.

The last rule should look like this:

html, body {
background:url(http://www.32smallshipsqn.org.au/Graphics/grade.jpg) repeat-x 
top left;
}

You have some markup and CSS validation errors you may want to correct.


Best wishes for your mission, Major Tom.

Ground Control, Houston







-- 
http://chelseacreekstudio.com/

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


Re: [css-d] padding problems in IE6

2008-02-03 Thread Philippe Wittenbergh

On Feb 4, 2008, at 4:53 AM, Juli Zanocco wrote:

 And a little problem with FireFox:
 On this page:  http://www.newmoonfarm.net/Farm-pages/Image2.html
 I have arrow gifs used as background images in paragraph tags.
 Safari and Explorer (even IE5mac) expand the block to encompass the
 gifs but Firefox does not.  I've had to add a bunch of nbsp's to get
 the gifs to show.  What am I doing wrong here?

Firefox 2 doesn't support 'display:inline-block', and treats your  
links as inline elements; in that case 'width' (and 'height') is not  
applied (correct).

A better solution for those links is to drop the specified width  
completely, and use padding-left/padding-right to create a space for  
the background image.

e.g.
.previous {
display: inline-block; /* Fx2 won't understand this, but in htis case  
it doesn't matter much */
padding-left: 50px;/* wider than the image */
margin-right:5px;
background: url(../images/previousarrow.gif) no-repeat 0 2px;
/* adjust padding-top and padding-bottom to taste */
}
This also has the advantage of being much more friendly for font- 
resizing.


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




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


Re: [css-d] Using CSS to control PDF for print

2008-02-03 Thread Chang Huang
Hi, thanks for your responses.

Here's the problem:
I have a well styled page, table, links, italics, bold, etc, everything
looks good. But after I convert it into PDF (using Coldfusion), the table
(which was styled with single border), now has the ugly double borders; some
text formatted in italic or bold has bad spacing issue, they seem to be
overprinting or otherwise leaving big gap between them.

Could this be a CSS problem or CF problem?

Thanks.

On Sat, Feb 2, 2008 at 9:12 AM, Michael Adams [EMAIL PROTECTED]
wrote:

 On Fri, 01 Feb 2008 18:46:35 +1100
 Chang Huang wrote:

  Hi all,
 
  I've been reading about how to use CSS to control the layout of a web
  for print, I wonder is there's a optimum way to style a web-generated
  PDF for print. I've been googling it for a while but with no success.
  Can anyone point me to the right direction please?
 

 Also one thing that is so glaring that you probably have not failed to
 notice. PDFs created on the fly on the server are dependent on the fonts
 on the server, if it isn't on the server it can't get embedded. Web
 pages created in HTML are dependent on the fonts at the client.

 --
 Michael

 All shall be well, and all shall be well, and all manner of things shall
 be well

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




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