Re: [css-d] Background repeating in print/preview
On May 30, 2009, at 2:48 AM, John Middleton wrote:
I'm having a puzzling CSS print issue I'd like some input on, if
some of
you don't mind assisting.
I have this HTML document online at:
http://www.ncddr.org/kt/products/ktintro/.
When I print or print-preview the CSS ID image repeats on every
printed
page (if BG images are set to print via the browser).
Well at least they do for Mac OS X 10.5 Firefox 3, Safari.
What can I do so this background image is displayed only once, like it
is displayed in HTML?
#mainboxcover { padding: 0px 0px 10px 0px; border: 1px groove
#175c93; background-image:
url(/kt/products/ktintro/images/cover.jpg); background-repeat:
no-repeat; background-position: top; background-color: #FF; }
Sounds like yet another print-bug in Gecko. I can't reproduce that
issue in Safari (tested: 3.04, 4b and nightly build - 10.5.7 with 2
different postscript printers ). Opera 10a print-preview doesn't
repeat the image either.
Note: I only tried to print-to-pdf, didn't want to damage trees.
I don't see much of a workaround, except , maybe, put the background-
image in an absolute positioned div behind #mainboxcover, with
negative z-index. Kind of ugly construction, though.
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
__
css-discuss [cs...@lists.css-discuss.org]
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] site check, particularly on ie6 ?
snak detek+0r wrote: Index and all inside pages: Neither Opera or The IEs are capable of scaling line-height set in pixels. Try a raw number for line-height. wow. didn't even know i could do that. the w3 site doesn't even mention that you can use px, but everyone and their mom seem to, including ALA, some grid-layout people, etc. sheesh. i normally use em, when starting from scratch, but apparently that's wrong too? No, 'em' for line-height isn't wrong. The resulting line-height is just calculated different from when raw numbers are used. For line-height:'em' values gives line-heights based on actual font-size for an element's parent, which is ok if that's what you want. When raw numbers (no unit) are used, line-height is calculated from actual font-size of the element itself, which in most cases gives the best result. Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. i'm not sure what you mean by this? i don't have any fonts nearly that big. and i also couldn't see what you're talking about in ff/chrome. today i got ahold of ie6, and still didn't see it. David is referring to a browser setting - 'minimum font size' option - that some end-users set to resize text on _all_ sites... http://www.gunlaug.no/contents/wd_1_03_04.html http://www.gunlaug.no/contents/wd_additions_37.html ...without having to bother with resizing or zooming on individual sites. Observations across the web indicates that few web designers know about, or test for, this option. The result is that many sites break under the stress of browsers' 'minimum font size'. (Note: Fx 3+ resizes text more or less like Safari does for the 'minimum font size' option in most but apparently not in all cases. Google Chrome doesn't seem to have this option.) regards Georg -- http://www.gunlaug.no __ css-discuss [cs...@lists.css-discuss.org] 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 or javascript hacks for firefox
Jenny, See: http://www.w3schools.com/browsers/browsers_stats.asp HTH, Cor - Original Message - From: Jenni Beard je...@theweblotus.com To: css-d@lists.css-discuss.org Cc: da...@chelseacreekstudio.com Sent: Saturday, May 30, 2009 4:42 AM Subject: Re: [css-d] css or javascript hacks for firefox I don't know any IE7 hacks, nor have I seen any. Now, IE6, THAT'S another story! That browser is/was SO annoying. Anyone know what % of people are still using IE6 anyway? Last stats I heard were from almost 2 yrs ago, that claimed almost 25% of internet users... Thanks! Jenni -Original Message- From: David Laakso [mailto:da...@chelseacreekstudio.com] Sent: Friday, May 29, 2009 8:47 PM To: Jenni Beard Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] css or javascript hacks for firefox Jenni Beard wrote: Generally these days I code for IE7, then check out Mozilla and Opera (and am getting ready to embark on Google Chrome, alas!), then add hacks where needed since these all seem to render most CSS layouts a bit differently. Code to IE/7??? I don't think so. Code to compliant browsers. Hack non-compliant browsers: IE/6 and IE/7. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] 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] google translator gadget affecting css
On 30/05/2009, at 2:49 PM, Jenni Beard wrote: Not to sound dumb, but what do you mean by 404s? I always referred to a 404 as a missing page error... That's right. The images I mentioned are referred to in the code but not in the expected locations and the server is returning a 404 page not found header. Firebug is an incredible, indispensable firefox extension that I'd recommend familiarising yourself with. If you look at your page and open the 'net' tab it shows you the various network interactions that are occurring in your page and you will be able to see which files are missing or not in the correct location. Cheers, Tim __ css-discuss [cs...@lists.css-discuss.org] 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 or javascript hacks for firefox
On 30/05/2009, at 3:00 PM, Jenni Beard wrote: So, now I feel like I have to add a hack for Chrome The vast majority of the time the only browser that requires special rules and hacks is Internet Explorer. If you find yourself reaching for hacks to make things look consistent in other major browsers then their is likely to be a problem with how you've approached your markup or CSS. I know it can be frustrating, but hacking things this way and that is not the answer! Cheers, Tim __ css-discuss [cs...@lists.css-discuss.org] 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] Taming table widths
I've got a site that is built using tables for layout and I'd like to eliminate the small horizontal scroll that shows up. I am assuming it has something to do with the margins/padding in all the nested tables but I would expect the problem to show up in IE or in FF but not both. It also goes the same thing in different screen settings. The method to fix this, according to w3schools, is to assign a set value in percent or pixels to the table. I've tried both in variations of 100%,90% and low values like 60% but they all show the change momentarily and pop back up to 'full size.' I reduced the sizes of the major internal tables but it did the same thing. I checked the cs-discuss wiki and searched some of the archives for other solutions. I've tried border-collapse:collapse (which doubled the size of the horizontal problem) and separate which showed no change. I also tried having a containing div set to widths auto and 100% but that didn't fly either. Any other suggestions I can try? The site can be seen at checkitlocal.com/index.php and a copy of the css can be found at checkitlocal.com/css.css . Thanks for your assistance! -Delos __ css-discuss [cs...@lists.css-discuss.org] 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] Taming table widths
On Sat, May 30, 2009 at 9:08 AM, Delos Woodruff de...@nycap.rr.com wrote: I've got a site that is built using tables for layout and I'd like to eliminate the small horizontal scroll that shows up. I am assuming it has something to do with the margins/padding in all the nested tables but I would expect the problem to show up in IE or in FF but not both. It also goes the same thing in different screen settings. One issue is that the main table's width is 100%, but it's also surrounded by a 1px border, so the total computed width of the outermost table is 100% + 2px. But probably the bigger challenge is the tremendous number of nested tables your layout has; each one appears to have inline styles associated with it as well as percentage-based width declarations (either via the width attribute or through inline styles). And some of the tables with width=100% also have their cellpadding attributes set to larger than 0, which might also be affecting your issue. This level of unnecessary complexity is one of the reasons I avoid table-based layouts (aside from in HTML emails), but since this is the layout you have, I'd recommend making extensive use of the Firebug plugin for Firefox: http://getfirebug.com/. Erik __ css-discuss [cs...@lists.css-discuss.org] 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] site check, particularly on ie6 ?
Gunlaug Sørtun wrote: snak detek+0r wrote: [...] Index: Minimum font-size 24px breaks the h-nav and does a little number on the text in right column. i'm not sure what you mean by this? i don't have any fonts nearly that big. and i also couldn't see what you're talking about in ff/chrome. today i got ahold of ie6, and still didn't see it. David is referring to a browser setting - 'minimum font size' option - that some end-users set to resize text on _all_ sites... http://www.gunlaug.no/contents/wd_1_03_04.html http://www.gunlaug.no/contents/wd_additions_37.html ...without having to bother with resizing or zooming on individual sites. Observations across the web indicates that few web designers know about, or test for, this option. The result is that many sites break under the stress of browsers' 'minimum font size'. [...] FWIW - I have set a modest minimum font size of 12px on my browsers. My primary browser, Opera 9.6 on Mac, scales up _all_ fonts on pages that have the seemingly popular 62.5% font-size set on BODY. It amazes me how many pages break with that slight increase. :( Cordially, David -- __ css-discuss [cs...@lists.css-discuss.org] 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] site check, particularly on ie6 ?
On 2009/05/30 09:45 (GMT-0700) David Hucklesby composed: FWIW - I have set a modest minimum font size of 12px on my browsers. My primary browser, Opera 9.6 on Mac, scales up _all_ fonts on pages that have the seemingly popular 62.5% font-size set on BODY. It amazes me how many pages break with that slight increase. :( .625 * 16 is 10. 12 is 120% of 10. I wouldn't call 20% particularly slight in a context where people notice as little as 1px differences. My minimum font sizes vary between 15px 18px depending on resolution and default setting (between 20px 24px). Few 62.5% body pages fail to at least partially disintegrate for me unless I make them useless by disabling minimum font size. :-( Good thing modern browsers allow to disable styles entirely. -- A fool gives full vent to his anger, but a wise man keeps himself under control. Proverbs 29:11 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://fm.no-ip.com/ __ css-discuss [cs...@lists.css-discuss.org] 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] Menu in IE 6
Hi everyone - Just launched a new site a few days ago and one person is reporting that the CSS menu on the left doesn't work right in IE 6. I just loaded MS Virtual machine with XP SP3 and IE 6, and confirmed that it shows fine while the page is loading, then it goes away. The site validates, and runs fine in IE 7 and 8, Firefox, Safari, and Chrome. The site is www.hcaa.com. Any thoughts on what I can do/try? Thanks! Todd __ css-discuss [cs...@lists.css-discuss.org] 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] css interference
In addition to my site being a smidge too wide, I have a more
important issue to worry about. Does php somehow interfere with css
statements? I am trying to create a tab nav like you find at
http://www.cssplay.co.uk/menu/one_page
I have the code working perfectly on a test html page at home. When I
upload it (with the php code that shows the reviews, etc of the
individual listings) to the site, it displays the default div but does
not show the hidden divs when hovering over the tabs. (The site is
checkitlocal.com/index.php and a copy of the css file is at
checkitlocal.com/css.css)
Here's the relevant css code as I've modified it:
---
.tabborder {height:600px;width:800px;}
.listingdefault {background:#ff;height:auto;width:55%;padding:3%;}
.listingbox {border:#cdcdcd solid 1px;margin:1px 0 0 0;height:
605px;width:805px;}
.listing {background:#ff;height:auto;width:55%;padding:3%;}
.extras {width:30%;float:right;padding:3%;}
/* set up the overall width of the menu div, the font and the margins
with a relative position*/
.menu { position:relative;width:100%;z-index:100;clear:both;}
/* remove the bullets and set the margin and padding to zero for the
unordered list */
.menu ul.tab {padding:0;margin:0;margin:0;list-style:none;}
/* float the list so that the items are in a line */
.menu ul.tab li.tab {float:left;width:auto;}
/* style the tabs. */
.menu ul.tab li.tab a, .menu ul.tab li.tab a:visited
{display:block;font-weight:bold;text-align:center;padding-left:
50px;padding-right:50px;text-decoration:none;height:
30px;color:#00;background:#ff;line-height:30px;border:#cdcdcd
solid 1px;}
/* make the dropdown ul invisible */
.menu ul.tab ul.tab {position:absolute; left:-px; height:0;}
/* set the background and foreground color of the main menu items on
hover */
.menu ul.tab li.tab a:hover,.menu.tab ul.tab li.tab:hover a
{color:#477ffd;background:#ff;border-bottom:#ff solid 1px;}
/* make the content ul visible and position it beneath the first list
item */
.menu ul.tab :hover ul.tab {left:5px;height:500px;width:
100%;background:#ff;text-align:left;z-index:100;}
/* make the content ul li the full width with padding and border. Add
an auto scroll bar */
.menu ul.tab :hover ul.tab li.tab {height:500px;width:
100%;overflow:auto;}
---
And the bits from the html that I've uploaded to the correct file:
---
div class=tabborder
div class=menu
ul class=tab
li class=taba href=#hoverReviews/a
ul class=tabli class=tab
div class=extras
(This is the extra content area where there are a few php echo calls,
some images and text with a span class of text.)
/div
div class=listing
br /br /
This is the main content area where there are a few php echo calls,
some images and text with a span class of text.
/div!-- end listing --
/li/ul/li
(repeat the above chunk a few more times for multiple tabs. The chunk
below is what shows as a default when the tabs are not being hovered
over.)
div style='width:100%;height:30px;'/div
div class=listingbox
div class=extras style=text-align:center;br /br /
(Here is default extra content that happens to have no php code.)
/div
div class=listingdefault
(This is the main content area where there are a few php echo calls,
some images and text with a class of text. This displays exactly as
expected.)
/div!-- end default listing --
/div!-- end listing box --
/div!-- end menu --/div!-- end tabborder --
---
Any thoughts? There is a little bit of javascript in the site code
which doesn't look like it has anything to do with menus. I took extra
steps to label all the tags with a tab class to help keep them unique.
Best regards and thanks,
-Delos
__
css-discuss [cs...@lists.css-discuss.org]
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] Creating css Tables with vertical text
20090530 1600 GMT-5 Im wanting to create a table to hold the soccer states for the adult league (I play in). Im using a table to hold the data but, Im short on horizontal space so I wanted to turn the text from horizontal to say almost vertical on its side -- like in a spreadsheet. Anyone doing this, ..,done this? I did some searching but Im not getting the right search time down as Im getting results but its not what Im looking for. Wade -- Registered Linux User: #480675 Linux since June 2005 __ css-discuss [cs...@lists.css-discuss.org] 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 interference
On 31/05/2009, at 5:13 AM, Delos Woodruff wrote:
In addition to my site being a smidge too wide, I have a more
important issue to worry about. Does php somehow interfere with css
statements? I am trying to create a tab nav like you find at
http://www.cssplay.co.uk/menu/one_page
I have the code working perfectly on a test html page at home. When I
upload it (with the php code that shows the reviews, etc of the
individual listings) to the site, it displays the default div but does
not show the hidden divs when hovering over the tabs. (The site is
checkitlocal.com/index.php and a copy of the css file is at
checkitlocal.com/css.css)
Here's the relevant css code as I've modified it:
---
.tabborder {height:600px;width:800px;}
.listingdefault {background:#ff;height:auto;width:55%;padding:3%;}
.listingbox {border:#cdcdcd solid 1px;margin:1px 0 0 0;height:
I'm afraid I can't see what your question is. I viewed source and
started looking for these classes and they aren't there. Am I missing
something?
PHP will not interfere with anything around CSS. The only time there
will be a problem is if the *output* from the PHP is different from
your static mockups. The only other situation I can think of that
might cause a problem is if you are processing your CSS with PHP and
it doesn't return the correct content type in the header (text/css).
__
css-discuss [cs...@lists.css-discuss.org]
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] Creating css Tables with vertical text
Wade Smart wrote: 20090530 1600 GMT-5 Im wanting to create a table to hold the soccer states for the adult league (I play in). Wade Put the page on a public server. Provide a clickable link to it in your post to the list. __ css-discuss [cs...@lists.css-discuss.org] 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 interference
Delos Woodruff wrote: In addition to my site being a smidge too wide, I have a more important issue to worry about. Does php somehow interfere with css statements? I am trying to create a tab nav like you find at http://www.cssplay.co.uk/menu/one_page I dunno. Your css snippet appears to be valid. Your markup snippet appears not to be valid. Perhaps you might put the page/site on a public server. And provide a clickable link to it in your post to the list? __ css-discuss [cs...@lists.css-discuss.org] 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] Menu in IE 6
Hi, In case it is of interest to you, the website is blocked in China. The Great Firewall in Beijing. cb On 31/05/2009, at 4:04 AM, Todd Richards wrote: Hi everyone - Just launched a new site a few days ago and one person is reporting that the CSS menu on the left doesn't work right in IE 6. I just loaded MS Virtual machine with XP SP3 and IE 6, and confirmed that it shows fine while the page is loading, then it goes away. The site validates, and runs fine in IE 7 and 8, Firefox, Safari, and Chrome. The site is www.hcaa.com. Any thoughts on what I can do/try? Thanks! Todd __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] 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/
