Re: [css-d] Stylesheet just for Safari

[David Laakso]

Nancy Johnson wrote:
> I have a very tight layout and Safari is displaying a tag differently
> than Firefox.  How would you embed a separate style sheet for Safari
> into a webpage?
>
> with IE differences I have been using the following
>
> 
>
> Thank you
>
>   


Provide a clickable link to the page in question or a test page  that 
exhibits the problem.

Best,
~dL




-- 
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] Three column variable width columns with padding

[Matthew Taylor]

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.

- Matt =)

Matthew James Taylor
http://matthewjamestaylor.com



- Original Message - 
From: "Aaron Gray" <[EMAIL PROTECTED]>
To: 
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/ 

__
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

[Aaron Gray]

> 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.

Great thanks alot, I could not get a footer to position properly on the 
example I was using. I see yours has a footer which is great.

Many thanks Matt,

Aaron

> - Matt =)
>
> Matthew James Taylor
> http://matthewjamestaylor.com
>
>
>
> - Original Message - 
> From: "Aaron Gray" <[EMAIL PROTECTED]>
> To: 
> 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/
> 

__
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] Noob with float/div problems

[David Laakso]

Ken Davies wrote:
> Original site   http://www.equestrian-jewelry.com/index.htm  - Right now 
> I am just worried about the top banner.
>
> Visually what works best is http://www.equestrian-jewelry.com/test1.htm
>
>
> I think  http://www.equestrian-jewelry.com/jewelry_horse.htm  is as 
> close to proper as I can see. It even validates-but the banner doesn't 
> layout properly.
>   
> http://www.equestrian-jewelry.com/test2.htm looks good  (alternate text 
> only shows) but the right  image is dropped to low.
>
>
> Ken
>   

Ken,

I think I'd go for broke and do the whole thing with CSS. If you are 
anything like me, it helps to have an example. If so, this is in keeping 
with that  [1].

If you want it to run rail to rail, simply change the 776px widths to 
100%. Quick checked in IE/6 an 7; and FF, Opera.


[1]


Regards,

~dL

-- 
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] Noob with float/div problems

[Michael Adams]

On Fri, 01 Feb 2008 04:11:15 -0800
Ken Davies wrote:

> Hello and thanks for letting me join your group, although it's very 
> intimidating for a novice.I am definitely not a hand coder, but I sure
> have changed a lot of code by hand. I built a table oriented image
> heavy website no CSS. I struggle to get to first base with CSS on my
> top banner, it should be simple- changing the text between my logo and
> a gif one of my rings. It is presently a fixed size table that I think
> should expand to the browser.

In addition to Arlen's words of wisdom. If the image isn't vital to the
page content then put it in the background. The jewellery item at the
right could be in the background.

#banner {
background: url(/images/Animation11.gif) right center no-repeat;
}

#banner p {
padding-right: 83px; /* leaves Animation11.gif uncovered */
}

Putting it in the background makes it part of the template and releases
it from the requirement to have alt text. The background "center" is
optional as vertical centering is the default, i put it in, but you
could change it to top, bottom or delete it if you choose.

Also it looks like that image is meant to be an animation but my browser
reports an error in the image and no animation takes place.

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

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

[Michael Adams]

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/

[css-d] printing online forms

[Jessica Tanny]

Hello -- 

I'm the webmaster for a regional archives organization who have asked me to 
update an online member application form.

They do not want members to email the form to them, but rather fill in the form 
online, print it out, and mail it in. I know this could be accomplished very 
easily with a PDF form, but I think the idea is to be as user-friendly (and 
accessible) as possible, so we've tried to limit the number of PDFs on the 
site...

So... since I am in the process of teaching myself tableless design with CSS 
and thought I'd start here. I built the form with CSS (with many thanks to "CSS 
Mastery" by Andy Budd), but now I need it to print properly. 

I've created a print stylesheet and now the biggest issue I'm having is getting 
the checkbox columns to work in the print-out. They look great on the screen 
and they print really awful... I'm trying so hard to make this work, but I'm 
not exactly sure what I am doing wrong.

Here is the online form:
http://www.lib.umd.edu/MARAC/members/member-app.html

Here is the form stylesheet:
http://www.lib.umd.edu/MARAC/forms.css

Here is the print stylesheet:
http://www.lib.umd.edu/MARAC/print.css

Any suggestions or resources you could point me to?

Thanks, 

Jessica Tanny




_
Shed those extra pounds with MSN and The Biggest Loser!
http://biggestloser.msn.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] Three column variable width columns with padding

[Aaron Gray]

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

Okay got a working example :-

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

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] Accounting for Windows DPI settings

[Ray Schamp]

Hi,

On Feb 1, 2008 3:02 PM, David Hucklesby <[EMAIL PROTECTED]> wrote:
> On Thu, 31 Jan 2008 13:36:02 -0500 (EST), [EMAIL PROTECTED] wrote:
> Tedd Sperling[1] sizes everything in ems. I am certain that his site
> is viewable under almost any circumstance I can think of.
>
> [1] http://sperling.com/examples/zoom/

The problem I always have with this technique is that background
images don't scale -- is there any CSS-only way to compensate for
that?  The only solutions I've been able to come up with involve using
 tags in semantically incorrect places or dynamically switching
background-imaged elements with   elements, neither of which make
me feel good inside.

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

[Sébastien FICHOT]

Hi Chang,

Stylising web rendered PDF is as feature included in the PDF  
proprietary format.
You have 3 entry point for this, depending on how you generate your PDF.

1 : you can set a custom CSS class for any element of the PDF when you  
create it with Adobe Acrobat Pro 8, or, if you dynamically regenerate  
your PDF excracting each element, you can set a CSS class for each  
type or named element.

2 : you can join a custom CSS file to be applied on your PDF  
programmaticaly. This depend on the component you use for rendering  
PDF to HTML. This could be (ASP.net) objMyPDFDocument.customCssFile or  
objMyPDFWriter.RenderingRules (this one would allow XSLT too, using a  
RulesFactory I guess). If ou details your methods I can help you more  
on this.

3 : For printing, you can use the @media clause in order to give  
correct CSS classes to print only.
@media screen {
   /* Specific Screen rules */
}
@media print {
   /* Specific Print rules */
}
@media all {
   /* Non-specific rules */
}


Nevertheless, the better way to make stylised PDF document is ... to  
render them in XML format and then use XSLT, or render them in HTML  
and use standard CSS. Components exists on the web, but they ae very  
expensive.


Cheers,

Sébastien
__
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

[Ken Davies]

Thank you for not laughing at me and for the very constructive advise. I 
will get back at it tonight.
Re -using h1,h2 tags. I tried that a few times but couldn't get the text 
to stay inside the images. Maybe with other
corrections it will work. Also the borders showing originally is because 
I was even more of a noob then.
I will persevere.
I even over thought "asking for help". It is less painful than I had 
been thinking.
Thanks again
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] css menu text misplaced

[Shanna Korby]

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/

#outerWrapper #contentWrapper #leftColumn1 ul li {
font-family: "Futura Book", futura, Arial, Helvetica, sans-serif;
display: block;
height: 30px;
font-size: 12px;
border-top-width: 1px;
border-top-style: dotted;
border-top-color: #B3A193;
list-style-type: none;
letter-spacing: 0.2em;
vertical-align: middle;
}
#outerWrapper #contentWrapper #leftColumn1 ul li a:focus {font-family: 
"Futura Book", futura, Arial, Helvetica, sans-serif;
display: block; height: 30px;
font-size: 12px;
border-top: 1px dotted #B3A193;
list-style-type: none;
background-image: url(images/li-bg.jpg);

}

Thanks.
Shanna
__
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

[D A]

> 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?

I have NO idea if this is related, but Prince is an application that's
designed to create PDF files for print using CSS:

http://www.princexml.com/

There was recent discussion of it on Typophile:

http://www.typophile.com/node/40332

(Not affiliated, just found it to be an intriguing product)

-Darrel
__
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] Three column variable width columns with padding

[Aaron Gray]

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] Accounting for Windows DPI settings

[David Hucklesby]

On Thu, 31 Jan 2008 13:36:02 -0500 (EST), [EMAIL PROTECTED] wrote:
>
> How does one test for this? Switching DPI settings is a pain (reboot 
> required) but the
> results of not accommodating it is significant.
>
> Any one else run into this? If so, how are you working around it?
>

This is the same problem that visitors have with text size enlarged,
or with minimum font size greater than 16px. *All* these users benefit
from your use of relative sizes (percents and ems) instead of pixels.
No testing for DPI settings needed. (Although it can be done with
scripting.)

Tedd Sperling[1] sizes everything in ems. I am certain that his site
is viewable under almost any circumstance I can think of.

[1] http://sperling.com/examples/zoom/

Cordially,
David
--

__
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] Stylesheet just for Safari

[Nancy Johnson]

I have a very tight layout and Safari is displaying a tag differently
than Firefox.  How would you embed a separate style sheet for Safari
into a webpage?

with IE differences I have been using the following



Thank you
__
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] hand coders vs wsywig coders...I had no idea

[Zach Shepherd]

Due to a resounding lack of interest (of the few people that emailed, some
even emailed just to let me know that in the past such ideas didn't develop
much momentum), and conflicting requests from those who were interested (I
got a few "don't bother with anything but _" requests), it doesn't look
like such a survey would be worth the effort. (Maybe people feel differently
and just haven't expressed that opinion. If so, I'd be happy to reconsider.)

If anyone is interested in general web development habits, I'd suggest
http://www.alistapart.com/articles/2007surveyresults. It'd be nice to see a
survey focused on css development habit, but it would be silly to go to the
effort of development if there's very limited interest.

Regards (and apologies for the slightly off topic post),
Zach

On Jan 25, 2008 10:44 PM, Zach Shepherd <[EMAIL PROTECTED]> wrote:

> I'll bite.
>
> I haven't seen any comprehensive surveys about css development habits and
> I certainly think it'd be an interesting thing to get some more information
> on.
>
> I'd certainly be open to suggestions about questions/topics. In the
> interest of keeping Off Topic posts off of the list, I'd ask that people
> send any comments about this directly to me when appropriate. The set-up
> time will depend on the volume of ideas/requests I get. I'll drop a link to
> the list when it's up and running.
>
> Regards,
> Zach
>
>
> On Jan 25, 2008 2:54 PM, Eric A. Meyer <[EMAIL PROTECTED]> wrote:
>
> > At 1:46 PM -0500 1/25/08, Scott Thigpen wrote:
> >
> > ...
> > And if someone wants to set up a short-ish survey about people's CSS
> > development habits, let us know you're on it and then announce the survey
> > location once it's ready to go.
> > ...
> >
> > --
> > Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone
> > "CSS is much too interesting and elegant to be not taken seriously."
> >   -- Martina Kosloff (http://mako4css.com/)
> > __
> > css-discuss [EMAIL PROTECTED]
> > http://www.css-discuss.org/mailman/listinfo/css-d
> > List wiki/FAQ -- http://css-discuss.incutio.com/
> > List policies -- http://css-discuss.org/policies.html
> > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> >
>
>
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Noob with float/div problems

[Arlen Walker]

> I sent that 5 hours ago. I want to end up  with a very similar look  
> but
> expanding to fit the window, not fixed width.

Then change the CSS I posted. Maybe something like width:100% or  
width:95% and add some margins. Whatever you want to see.


Have Fun,
Arlen

--
In God we trust, all others must supply data

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

[Ron Zisman]

http://www.ricochet.org/ricochet2/company_principal.html

original page (above) validates and goes cross browser fairly well, i  
think.
it has some scaling issues on fonts, messing badly with alignment.

at issue was as the gray box expands vertically, it changes the  
positions of the arrows which are intended to let people cycle  
through the site quickly.
i want the position of the arrows to remain constant, and wanted to  
move them under 'Communications Design'


http://www.ricochet.org/ricochet2/company_principal_alt.html

the page validates, works and scales well in firefox, but opera and  
safari push the #rightcol to the bottom left corner.

looking for a remedy.

any help?

--ron
__
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] Split image in two divs...idk

[Brian Jones]

I'm developing a
site(http://www.bleusolutions.com/pianoguy/piano.html) .How can
construct my css and cut the image so that the bottom of the brown
star seal appears in the top right corner of the #wrapper div and top
of the seal is in the header...right now I just have it as one big
image (http://www.bleusolutions.com/pianoguy/images/hdr_img.jpg) which
I do not want to do

-- 
-Bdot
"There are only 10 kinds of people in this world. Those who understand
binary and those who don't"
__
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] Noob with float/div problems

[Valerie Wininger]

Ken,

That helps.  Did you see Arlen's response?  I think you will find it
extremely helpful and probably won't need any more help after reading
through it all!  If you still do, let us know.

Thanks and good luck,

On Feb 1, 2008 12:40 PM, Ken Davies <[EMAIL PROTECTED]> wrote:

>  Hello Valerie and wow
> I sent that 5 hours ago. I want to end up  with a very similar look but
> expanding to fit the window, not fixed width.
>  Thats what I wanted originally, and I still do. I have been working on
> all the areas I need to improve it too, first things first.
> Also should I send this email to the original list address.
> and thank you
> Ken
>
>
> Valerie Wininger wrote:
>
> Ken,
>
> I'm not entirely sure what you want the site to look like.  On the current
> home page, you have a fixed width table, but it looks like you want to end
> up with a page that expands to fit the browser window.  Is that right?  Or
> do you just want the banner to expand?  A little more info about what you
> want the finished product to look like would be helpful.  Then we can go
> from there.
>
> On Feb 1, 2008 7:11 AM, Ken Davies <[EMAIL PROTECTED]> wrote:
>
> > Hello and thanks for letting me join your group, although it's very
> > intimidating for a novice.I am definitely not a hand coder, but I sure
> > have changed a lot of code by hand. I built a table oriented image heavy
> > website no CSS. I struggle to get to first base with CSS on my top
> > banner, it should be simple- changing the text between my logo and a gif
> > one of my rings. It is presently a fixed size table that I think should
> > expand to the browser.
> > Original site   http://www.equestrian-jewelry.com/index.htm  - Right now
> > I am just worried about the top banner.
> >   http://www.equestrian-jewelry.com/stylesheets/horsejewelry.css
> > Visually what works best is http://www.equestrian-jewelry.com/test1.htm
> > http://www.equestrian-jewelry.com/stylesheets/test.css
> > This is what I want, the two large images are spacers for now till I get
> > the top working. This code isn't good but displays well on IE5,6,
> > Opera7,9 and Mozilla, even on old Netscape.
> > I think  http://www.equestrian-jewelry.com/jewelry_horse.htm  is as
> > close to proper as I can see. It even validates-but the banner doesn't
> > layout properly.
> >   http://www.equestrian-jewelry.com/stylesheets/test.css
> > http://www.equestrian-jewelry.com/test2.htm looks good  (alternate text
> > only shows) but the right  image is dropped to low.
> >   http://www.equestrian-jewelry.com/stylesheets/banner.css
> > I tried to keep this short but I keep wanting to cry. Can you please
> > take a look at what I have done and offer some advise?
> > 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/
> >
>
>
>
> --
> Valerie Wininger
> www.valeriewininger.com
>
>
>


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

[css-d] Safari a:hover problem

[John Gribben]

Hello,

 

Does anybody know how to fix the bug in Mac Safari that prevents the display
of a:hover effects in anchors placed within list items?

 

I've tried setting both the parent  and  to display: block and
position: relative, as recommended by a couple of Googled articles, but this
hasn't helped.

 

Thanks,

John

 

John Gribben

Pedrera, Inc.

215 348 7446

[EMAIL PROTECTED]

http://www.pedrera.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] PRE extends outside DIV

[Foundation Flash]

I would like to avoid scrollbars if possible, which I believe that would 
give me. It is an option though.

Simon Tiplady wrote:
> What immediately springs to mind is setting "overflow: auto;" on the ".code"
> definition, not sure if its the best option or even what you want...
>
> -Original Message-
> Subject: [css-d] PRE extends outside DIV
>
> So good. However, the design in liquid width, and yet the  extends
> outside the bounds of the div ( I know this is normal behaviour for a div,
> not to expand to fit its contents). Is there any way to force it to wrap
> onto the next line? 
>   

-- 
Harry Burt
Head Designer, *Foundation Flash*
/http://www.foundation-flash.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] PRE extends outside DIV

[Simon Tiplady]

What immediately springs to mind is setting "overflow: auto;" on the ".code"
definition, not sure if its the best option or even what you want...

-Original Message-
Subject: [css-d] PRE extends outside DIV

So good. However, the design in liquid width, and yet the  extends
outside the bounds of the div ( I know this is normal behaviour for a div,
not to expand to fit its contents). Is there any way to force it to wrap
onto the next line? 

__
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] PRE extends outside DIV

[Foundation Flash]

Dear all,
If you take a look at my site (link in signature) you will see we have a 
range of Flash tutorials, most of which include code (ActionScript). My 
personal preference is to have the code in a  tag in order to keep 
the  logical indentations, though I have only just started doing this.
So good. However, the design in liquid width, and yet the  extends 
outside the bounds of the div ( I know this is normal behaviour for a 
div, not to expand to fit its contents). Is there any way to force it to 
wrap onto the next line? We have a very variable-screen-sized audience, 
so forcing a new line would be out of the question really. Oh by the 
way, you may (resize if necessary) be able to see what I mean on 
http://www.foundation-flash.com/tutorials/xml/

Thanks,
-- 
Harry Burt
Head Designer, *Foundation Flash*
/http://www.foundation-flash.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] Noob with float/div problems

[Arlen Walker]

On Feb 1, 2008, at 6:11 AM, Ken Davies wrote:

> Original site   http://www.equestrian-jewelry.com/index.htm  -  
> Right now
> I am just worried about the top banner.

Off the cuff, here's the approach I'd take to the banner. I've done  
no testing on it, apart from Safari and Firefox, so it's not  
presented as a final solution, but rather as a place for you to start  
from:

HTML



Horse jewelry for equestrians and horse lovers.
Breeds of horses, barrel racing, rodeo, dressage, jumping and  
polo


CSS
#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%;}

Commentary:
I don't like CSS class names that are tied to the presentation,  
especially during development. During development, many aspects of  
the design are likely to change, and then I'll have to go back  
through all the pages and change the class name. I think it's a much  
better practice to create class and ID names related to the meaning/ 
function of the object being styled. Hence "logo" instead of  
"floatleft".

I also don't like using any more semantically empty tags (div, span)  
than I absolutely have to, hence only one. It junks up the document  
to use multiples, and while I'm not against doing so if I have to for  
a desired effect, I never do it needlessly.

With CSS on the scene, tags like "b" and "i" become redundant. Forget  
they even exist is my advice. That's what CSS is for.

The "p" for the title text is probably non-optimal. I'm not sure  
where you;re going with this, but replacing them with any sort of  
header tag would work as well, though you'll have to change the font- 
size to do so.

At a guess, I'd say you're overthinking it, and that's why you're  
stressed. The process is simple:

1. Content first. Write the text and select the images.
2. Break the document into logical sections, if possible.
3. Decide what the function of each element is. Is it a heading? then  
mark it with an "h" tag of the appropriate level. If it's an image/ 
description pair you could put it in a table (image in one column,  
description in the other) or a definition list (dt for image, dd for  
description).

Only now do we get to CSS

Notice to this point we haven't given a single thought to appearance.  
They're off-topic for the list, so I avoided detail, and won't  
discuss them further on list. But here we start with CSS, so I'll  
walk you through what I did to get the above code

I wanted two images, one at each end. One was the logo, so the logo  
ID would be enough to call it out. Since there isn't another img in  
the banner, a general img style could float it to the other side. You  
can reverse the two images n the HTML file, if you want. The greater  
specificity of the logo styling will always pre-empt the general  
float right to send it left.

Next, the original had two lines of text, centered, so I centered all  
the text in the banner. I killed the margins and padding because the  
browser defaults vary, and they all pretty much suck (browsers are  
lousy at typography). You can tinker farther with this by playing  
with line-height as well as padding and margin.

That gave me the images and the text, but the border wasn't there.  
The old site looked like a double border, so that's what I loaded  
here. Then I adjusted the height of the banner div (when the images  
floated, they were removed from the flow of the document, so the  
banner container shrank to the height of the text. You *could* play  
with the text size until the box was the right size, but that's open  
to being clobbered by someone using a strange text size (Yes, that's  
you, Felix ;{>} )

Now if you wanted to make it bulletproof (for modern browsers) you  
might want to recast the div and image sizes in ems, so they would  
grow along with the text. That would probably mean recreating the  
images at a larger size, then forcing the browser to shrink them down  
to "normal," but it's possible. Then as text size grows, the design  
elements grow with it. (Like implementing Opera's "zoom" feature in  
CSS for the other browsers.) But that's just personal quirks.

You might want to take a look at "Eric Meyer on CSS", where he walks  
through the process of taking a site from a table into pure CSS. (And  
I'd recommend it even if he wasn't the founder of our feast, so to  
speak.)

Or, if you're wanting to work a bit harder, pick up "Transcending  
CSS" (Andy Clarke's absolutely wondrous volume which epitomizes the  
ideal that a book on design should be a thing of beauty). The latter  
assumes a basic knowledge of CSS, though, so if you don't get it  
first, you may find parts of it hard slogging.

Have Fun,
Arlen

--
In God we trust, all others must supply data

__

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

[Lord Armitage]

On 01/02/2008, Chang Huang <[EMAIL PROTECTED]> 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?

Hy Chang,

if you're in control of the server environment you can produce great
results with CSS2XSL-FO  which produces
an xsl-fo file from your css and html (featuring great css suport,
including running headers, footnotes etc.) this xsl-fo file can be
sent to an xsl-fo processor to generate the desired PDF. Have a look
at the documentation for more information.

--
cheers
Milan Zoufal

__
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

[Jukka K. Korpela]

Chang Huang wrote:

> 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?

I'm not sure I understand your question correctly, but I have 
successfully created PDF versions of web pages, with CSS-enhanced 
presentation, using just the free PDFCreator software and a web 
browser - specifically, Firefox, since it supports alternate style 
sheets, so that I can use



and just select that style sheet from the browser's menu, so that I'll 
first see(roughly) on screen the effects of the foo.css style sheet. 
Then I just use the Print command in the browser and select the virtual 
printer corresponding to PDFCreator.

There are many other programs as well that can be used for making it 
possible to generate PDF files from a browser, but I haven't seen any 
comparison from the viewpoint how well CSS rules are applied. Maybe you 
could just try some alternative and see whether it fits. In simple 
cases, probably almost any such software will do.

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/

Re: [css-d] Accounting for Windows DPI settings

[David Laakso]

[EMAIL PROTECTED] wrote:
> In the last couple of weeks I've come across a couple of people in my
> organization who have their PCs set up so that the DPI setting is 120 DPI
> instead of the normal 96 DPI. This has caused all sorts of consternation.
>
> Any one else run into this? If so, how are you working around it?
>
> John Garison
>
>
>   





I guess there is a connection with CSS buried in here someplace...

If in the CSS, you set default on the body, and maintain it for the page 
primary content, you've got a shot at it. Care in the CSS not to 
restrict height, or provide work around for it when necessary helps. In 
addition to vertical fluidity, a well structured CSS layout can 
accommodates horizontal width differences due to font scaling-- min/max 
width and other means can be used to achieve this.

Testing from here to eternity is paramount. Testing in a small window, 
at +2 and also at minimum font-size at the largest setting in the 
Gecko's and Mac browsers, text-size "largest" (and font-sizes ignored) 
in all IE browsers, and setting a minimum font-size in Opera (a friend 
tests at 50px min) are some methods.

Regards,

~dL

-- 
http://chelseacreekstudio.com/

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

[css-d] Noob with float/div problems

[Ken Davies]

Hello and thanks for letting me join your group, although it's very 
intimidating for a novice.I am definitely not a hand coder, but I sure 
have changed a lot of code by hand. I built a table oriented image heavy 
website no CSS. I struggle to get to first base with CSS on my top 
banner, it should be simple- changing the text between my logo and a gif 
one of my rings. It is presently a fixed size table that I think should 
expand to the browser.
Original site   http://www.equestrian-jewelry.com/index.htm  - Right now 
I am just worried about the top banner.
   http://www.equestrian-jewelry.com/stylesheets/horsejewelry.css
Visually what works best is http://www.equestrian-jewelry.com/test1.htm
http://www.equestrian-jewelry.com/stylesheets/test.css
This is what I want, the two large images are spacers for now till I get 
the top working. This code isn't good but displays well on IE5,6, 
Opera7,9 and Mozilla, even on old Netscape.
I think  http://www.equestrian-jewelry.com/jewelry_horse.htm  is as 
close to proper as I can see. It even validates-but the banner doesn't 
layout properly.
   http://www.equestrian-jewelry.com/stylesheets/test.css
http://www.equestrian-jewelry.com/test2.htm looks good  (alternate text 
only shows) but the right  image is dropped to low.
   http://www.equestrian-jewelry.com/stylesheets/banner.css
I tried to keep this short but I keep wanting to cry. Can you please 
take a look at what I have done and offer some advise?
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/

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

[Phil Turner]

I think the full version of Acrobat Professional will give you  
options on web based settings
and saving files for print as far as I know - then you just create a  
downloadable pdf  file

same dessert - different tent


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

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

Please consider the environment before printing this email.



__
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] Using CSS to control PDF for print

[Chang Huang]

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?

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

[css-d] Accounting for Windows DPI settings

[john]

In the last couple of weeks I've come across a couple of people in my
organization who have their PCs set up so that the DPI setting is 120 DPI
instead of the normal 96 DPI. This has caused all sorts of consternation.
In one case, the guy was unable to use an application (some Oracle
Financial application or other) because the fonts were so large that they
caused drop-down lists to obscure important screen elements like buttons.
When he changed the DPI setting to 96, it worked fine.

How does one test for this? Switching DPI settings is a pain (reboot
required) but the results of not accommodating it is significant.

Any one else run into this? If so, how are you working around it?

John Garison



__
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] form/fieldset alignment in IE

[Ray Leventhal]

David Laakso wrote:
> Ray Leventhal wrote:
>>
>> http://www.cprtools.net/reg/regform1.php
>>




> 
> Assuming you can mess around and play games with the html:



> 
> 
> < :: add ::
> 
> 

> 
> 
> 
> < :: add ::
> 
> 
> And you may want to pay a visit to the Markup Validation Service.
> 
Hi David,

Thank you :)

The addition of the markup  between the  
tags did, in fact, do the trick.

Regarding validation, I was appalled to see that I'd submitted a page 
with so many errors, but in retrospect, I'd be messing with DTD to try 
to get IE to 'work' and have since fixed all but one.

On a side note (definitely OT - any replies to this, please send 
directly to me), how does one validate with an onSubmit() call in a 
submit button tag?

Thanks again,
-R


-- 
Non scholae sed vitae discimus
__
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/