[css-d] Poor CSS work processes
Hi all, Here's a quote from a recent post, which I've modified to make a point. I've removed the attribution, as my intention is not to single out any person in particular, but to make an observation about something I've seen with disappointing regularity: I recognize the frustration with browser A. Who here hasn't finisheda beautiful layout in browser B, and then screamed obscenities and frightened coworkers and family when you saw how browser A mangledyour beautiful and validated work? I know I have! Browsers A and B can be *any* browser. The problem is the work process by which a design is only checked in one, maybe two browsers while the development proceeds, then when everything is finished it is checked in more browsers. Software engineering has been slowing moving towards a maxim of test early, test often. It's taken many years to get there, but unit testing is now a common practice. Perhaps it's because a lot of web designers are more artist than engineer that that doesn't seem to be happening in this field? Not that I have anything against artists! :-) Most people will have a list of browsers they'd like their sites to work with. The exact list is not important. What is important is that if you're going to check your site in browser X, then you start checking right from the beginning, not at the very end! As a user of a minority browser (Opera), I perhaps see the results of lack of testing more often than others. I've lost count of the number of times I've found a one or two-line fix for a web designer oversight. Many studies have found that the earlier bugs are found, the cheaper, quicker, and easier they are to fix. That applies to web design too. I hope more of you might consider earlier testing. I expect the result would be happier web designers, and more robust cross-browser designs. Thanks for reading! -- Andrew Gregory, URL: mailto:[EMAIL PROTECTED] URL: http://www.scss.com.au/family/andrew/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Poor CSS work processes
At 11:27 PM 9/22/2005, Andrew Gregory wrote: ... The problem is the work process by which a design is only checked in one, maybe two browsers while the development proceeds, then when everything is finished it is checked in more browsers. It's great to see this point made, Andrew (although I'm not absolutely sure it's on topic for this list). A methodology I've found helpful in cross-browser development is to create wireframes early on: HTML markup with Greek text and a stylesheet that applies only layout positioning and just enough color to differentiate blocks. This is enough of a structure to test on a spectrum of browsers tweak before the final text graphics are ready to pour in. Paul __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Poor CSS work processes
Many studies have found that the earlier bugs are found, the cheaper, quicker, and easier they are to fix. That applies to web design too. I hope more of you might consider earlier testing. I expect the result would be happier web designers, and more robust cross-browser designs. What it assumes though is that the product specs and functionality are set in stone and known. Sadly enough web design is still considered a final making pretty stage in most development cycles that I have encountered and daily changes of the screen output are not uncommon. Furthermore it would be great if only people who know browser and user agent concerns would touch CSS and HTML, but it seems to be public domain, as - in enterprise level products - you will hardly be able to control all HTML and when clients do the maintenance you will get the inhouse designer/developer who knows a cool tool that generates code / CSS to mess with your stuff. During the heat of the development, with once again no contingency in the budget or time limit things can get overlooked - sometimes even on purpose to be able to show the client that some browsers show a bad layout and thus trying to get a new budget / second phase cleanup project signed off. It is easy to say I could fix this in two seconds and they should have thought of that' but especially the Front End Development part of the development cycle is never appreciated enough, it comes from the same budget as design and 90% of the resources and budget were blown in designing 20 rigid screens of the homepage. To get were you seem to think we are now we still have to make developers, clients and project managers aware that good web design starts before the visuals are being produced - with proper Information Architecture and a list of what has to be developed and for whom. -- Chris Heilmann Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Binaries: http://www.onlinetools.org/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Poor CSS work processes
Andrew Gregory wrote: ... Many studies have found that the earlier bugs are found, the cheaper, quicker, and easier they are to fix. That applies to web design too. And the earlier web designers include this point in their learning-process, the quicker they'll end up with cross-browser stable designs that won't be in need of any further debugging. I hope more of you might consider earlier testing. I expect the result would be happier web designers, and more robust cross-browser designs. Amen... Georg (designer + engineer = happy 'web carpenter') -- 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/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Safari problem
Hi all, Now that I've got browser testing off my chest, it's time to admit I haven't done much testing myself, in Safari anyway. My excuse is that I'm a Windows person, not a Mac person, and until very recently, didn't have access to a Mac at all. The closest I got to Safari was Konqueoror running on a Linux virtual machine - not very close! :-) In a recent visit to a Mac, I checked my site using Safari v1.3.1 and found a problem with my pure CSS drop-down menus. They work just fine in Opera, Firefox and IE (with script help) which leads me to think it's a Safari bug. Konqueror also has a problem in that the menus all appear in the left-most position. Safari chops off all the menus at the right edge of the left-most drop down, although they are active for their full width even if you can't see it. Ex. http://www.scss.com.au/family/andrew/pdas/palm/myprogs/sudoku/ I found a relevant report in Konqueror's BTS and the menus are still quite accessible, at least until you get fairly deep into my site. Safari is different since it looks ugly, and you have trouble reading the truncated items. The relevant styles are in: http://www.scss.com.au/styles/screen.css (about 100 lines down) I had a look on the cssd wiki for any Safari specific bugs and workarounds, but I couldn't find anything. Do such sites exist? Are there any workarounds or things I could try to resolve this? Thanks in advance for any hints, links, etc. -- Andrew Gregory, URL: mailto:[EMAIL PROTECTED] URL: http://www.scss.com.au/family/andrew/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site Check Please - Voices of CSM
Voices of CSM is a great website for a first attempt at CSS design. All those having trouble designing with CSS should learn from this example. If anyone has a moment and can check out my site (this is my first all CSS site) - it seems to be okay in IE6, FF, Opera NN7, but I'm not sure about other browsers or Mac. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Safari problem
Andrew Gregory wrote:
... Safari chops off all the menus at the right edge of the
left-most drop down, although they are active for their full width
even if you can't see it.
Ex. http://www.scss.com.au/family/andrew/pdas/palm/myprogs/sudoku/
Just a hint:
ul.menu li {
display: inline-block;
}
...works (somewhat) better in my Safari.
Must be added separately, as Firefox need 'display: inline;' as you have
now.
Still some Safari-problems that I couldn't work out (being a windows
person myself).
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/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] 100% Horizontal sub list was [*argh* listitis.....!?!?]
Eric Shepherd wrote: making it, but you can check out www.creeksidebanquet.com, and my article on A List Apart, at www.alistapart.com/articles/hybrid/, Hi Last night I worked through Erics ALA article, which is great. And I thought I'd achieved what I needed and yup it is (almost) all lovely in FF. Unfortunately its not so good in IE. (I thought I'd tested it thoroughly, but this morning it would appear I haven't!) Anyway in IE when the sublist is rolled over the li's all stop being inline and go vertically below the top sub list item. http://24.m-corp.com/ID02_detailedNewsStory.html If you have a moment please you take a look and see if you can figure out what I need to do, to stop the li's disappearing (help!) (Its soo close!) Thanks Kristina __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] Why don't my images appear on site?
images/masthead770.gif in your coding I guess refers to
originalmasthead.gif in your images folder. Filenames should be exactly
the same, otherwise they can't be found. Aside from that there are a lot
of images not in the folder you are refering to in your coding. Double
check if they are uploaded or maybe in a different folder.
snip
a:link, a:visited, a:hover {
color:#33;
text-decoration: none;
}
#button li a {
display: block;
padding: 5px 5px 5px 2em;
color: #fff;
/snip
Some other comments
The reason why your links don't show the way they do, is I think because
in the specification you put color: #33. Those are letters o in
stead of numbers 0. Change that and it should start to work.
Furthermore, not error related, but more cleanliness related; try to be
consistent in the units you use. For example in the #button li a you use
in the padding both px and em. Here and there you use 0px or 0.
Theoretically the value 0 doesn't need a unit. Elsewhere you use #ff
and #fff. Use of uppercase and lowercase. Indentation here, no
indentation there.
Those are not errors, but it's not neat, nor clear for yourself or
anyone else who might have to update it when you can't.
As earlier mentioned, there's a lot of specifications that can be
bundled. And validate, of course! That might solve the major part of
your problems.
Arno
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Why doesn't this page work?
I cannot believe how hard CSS is. I am ready to give up. What am I doing wrong? http://www.wminc.biz/newpage.htm Can anyone help me? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why doesn't this page work?
On 23/09/05, Nancy Smith [EMAIL PROTECTED] wrote: I cannot believe how hard CSS is. I am ready to give up. What am I doing wrong? http://www.wminc.biz/newpage.htm It really depends on how what you get is differing from what you want. To take a wild guess - you've made the links inside #button wider then #button itself (and that's before accounting for margin/padding/borders). -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Re: Negative Margin FireFox Mac Issue
Yazmin Media wrote: On 9/22/05, Zoe M. Gillenwater [EMAIL PROTECTED] wrote: It's probably a rounding error. Can you send the URL of the page that has a similar problem? Sure. Here it is: http://yazminmedia.com/playground/tabs.htm Ok, now you have me confused. This is the same link from before, which you said you had redone and fixed, right? And indeed, the tabs look the same to me on FF and IE. The first black tab blends into the box perfectly, and the subsequent tabs are separated from the box by its top black border (at least I think they are -- seeing the difference between charcoal gray and black is hard!) which seems correct to me. Can you explain what the problem is please? Maybe even post a screenshot of the problem versus the correct rendering? Zoe -- Zoe M. Gillenwater Design Specialist UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why doesn't this page work?
Nancy Smith wrote: I cannot believe how hard CSS is. I am ready to give up. What am I doing wrong? Relax. The learning-curve is pretty steep. After a while it's mostly fun all the way. http://www.wminc.biz/newpage.htm Can anyone help me? Sure... What's the problem? Add a few details to go with the page, please. I might end up giving cures for the wrong flaws otherwise. 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/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why doesn't this page work?
Part of the problem is at the end of your code you have: /body/html /body /html Drop the last two lines and that will help. Nancy Smith wrote: I cannot believe how hard CSS is. I am ready to give up. What am I doing wrong? http://www.wminc.biz/newpage.htm Can anyone help me? __ -- Joe Huggins __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Hey guys, I'm no spring onion when it comes to CSS, but creating this has me stumped. It's a centered layout, but with columns stretching out to the left edge. http://www.multiblah.com/exps/css/centered_left/left.html Is that possible to do that with CSS at all? I'm struggling to figure out how. Also, those rows, need to be flexible in size. If anyone has any ideas, or approaches I could try, I'd love to hear them. Thanks, - Kevin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Getting back into css...
On Sep 22, 2005, at 3:08 PM, Ian Skinner wrote: I have my copy, but have yet had the chance to read it, so I can only comment that it exists and had decent review on Amazon. I've read it, repeatedly. I can generally recommend anything with Molly's name on it, but this one is even better than her usual standard of performance. I learned a great deal about the kind of things that can be done (whether they *should* be done is another question, as usual) and I'm still not done assimilating it all. I'll be sitting here, working on an idea, and suddenly remember some little flourish that was in Zen of CSS Design that is similar to the design idea I just had and return to the book to study the technique again. I read the book through the first time, marking in my head the pieces of it that applied to designs I'd already done, then went back to those places and worked out how I really should have implemented the designs. Then went through the book again looking specifically at those little touches I had wanted to include before but couldn't figure out how to include. A copy belongs on *every* webmonkey's bookshelf. 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/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Safari problem
On Fri, 23 Sep 2005 16:21:37 +0800, Gunlaug Sørtun [EMAIL PROTECTED]
wrote:
Andrew Gregory wrote:
... Safari chops off all the menus at the right edge of the left-most
drop down, although they are active for their full width even if you
can't see it.
Ex. http://www.scss.com.au/family/andrew/pdas/palm/myprogs/sudoku/
Just a hint:
ul.menu li {
display: inline-block;
}
...works (somewhat) better in my Safari.
Only somewhat? Looks perfect from what I see. In Konqueror too. Thank you
so much!
Must be added separately, as Firefox need 'display: inline;' as you have
now.
That's easy, inline first, inline-block second.
It totally blew apart the IE rendering, though. I had to add:
html ul.menu li { display:inline }
into my IE hacks stylesheet (the html is there because the extra
specifity was needed for some reason).
Still some Safari-problems that I couldn't work out
You'll have to smack me over the head with them. The only other glitches I
could see was my validation icon pop-out at the bottom of the page, which
wasn't in the correct position until I hovered over it, and the Opera
browser button at the top right of the page was out by a pixel. Neither
are worth worrying about.
I'd been told the menus were bad in Safari months ago. This fix was so
simple, I wish I'd asked back then!
Thanks again.
--
Andrew Gregory, URL: mailto:[EMAIL PROTECTED]
URL: http://www.scss.com.au/family/andrew/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Can I style generated content?
Is it possible to style generated text?
/* Example: CSS */
a {
font-family: arial;
color: red;
text-decoration: none;
}
a.left-arrow:before {
content: ;
}
!-- Example: HTML --
a href=thispage.html class=left-arrowGo to this page/a
The link will appear in all red arial, like this:
Go to this page
Is it possible to make the appear in a different font or color? If
so, how would I make the appear different on :hover?
I have never used generated content b/c IE doesn't support it, but I am
trying something new, so I though I'd ask.
Thanks,
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Hi Kevin Kevin Cannon wrote: http://www.multiblah.com/exps/css/centered_left/left.html Do you have a screen shot online to demonstrate what you are trying to achieve? Do you know how big the left column will 'always' be? I'm no spring onion when it comes to CSS, but creating this has me stumped. It's a centered layout, but with columns stretching out to the left edge. I'm a little confused about what you mean by 'stretching out to the left edge' and be centered. Cheers now Kristina __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Maybe OT: As it is Friday - have a free CSS template
I just had some very good news and I have this template lying around. Did it for a friend but it seems it'll never pull off anyway... http://www.wait-till-i.com/index.php?p=165 enjoy and good weekend Chris -- Chris Heilmann Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Binaries: http://www.onlinetools.org/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Kevin: The site you gave does it really poorly. This is very easy to do with divs... you just put the fixed div inside the stretched div. Let me show you: div style= width:100%; div style= width: 550px; position:relative; left:50%; margin-left:-275px; content / div / div See what it does? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Kristina, The HTML I posted is what I want it to look like. (minus the red borders, which are just to show the tables) The 'left column' has to stretch to fill the space. The actual content, that's 750px wide, should always be centered, and the colours on the left adjusting to fill the space. That's the real challenge. If I could set it to be a specific size It's definately doable. Thanks, - Kevin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Hi Jim, That's almost there. The challenge i'm facing is how to get the rows to go flush to the left edge. What you've done there has got everything spot on up to that point. Do you think there's any way to persuade the those rows, to go flush to the left edge? Cheers, - Kevin On Fri, Sep 23, 2005 at 06:33:25AM -0700, Jim Davis wrote: Kevin, Here is my approach: http://www.jimdavis.org/test/locked_left.htm View source to see the css. Note that a 100% wide div with borders left and right will force a horizontal scroll bar in FF and IE 6 in standards mode. Thus the need for slightly less than 100% width if borders are used. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Maybe OT: As it is Friday - have a free CSS template
Christian Heilmann wrote: I just had some very good news and I have this template lying around. Did it for a friend but it seems it'll never pull off anyway... http://www.wait-till-i.com/index.php?p=165 enjoy and good weekend thanks chris, and that's also for the book tip. dwain -- dwain alford [EMAIL PROTECTED] http://www.alforddesigngroup.com The Savior replied; There is no such thing as sin;... 'The Gospel of Mary of Magdala' __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Off Topic - stats
Hi All, I am as guilty as most of being drawn into off topic discussion. Often not actually realising that it is off topic. Sometimes I have been surprised that certain subjects have been allowed to run as I thought them off topic. So I re-read all the guidelines and then did an analysis of the last 450 posts on this list to see what actually were the topics of discussion. I derived the following stats: On topic CSS practical discussion (general) 34.82% Request for a site check (Is this on topic??) 13.62% IE specific(majority IE non-compliance) 27.23% FireFox/mozilla specific 5.13% Opera specific 2.23% Safari specific 2.01% MAC IE specific 2.46% Off topic completely12.50% As can be seen from above and following on my own gut feel almost as much time is spent discussing hacking or pandering to IE as is done on general CSS discussion. I do believe that every know hack for IE has already been well documented and published as well as all it's unique foibles. Long before I joined this list I had found 99% of these hacks and work-arounds and implemented those I needed where I needed them. Those who have been on this list 'for ever' must be running crazy at the thought of another IE post. In the guidelines it specifically states to validate X/HTML code, yet a large number of requests for site check do not validate X/HTLM let alone CSS. I believe that those designing with CSS or intending to, are serious web designers and irrespective of working platform should have access to at least all the recent versions of IE, Mozilla/Firefox, Opera and Netscape as well as some text only browser available for localhost testing. My base operating system is XP SP2 so in order to allow for Linux I acquired an old PII 500mzh (US$50.00 complete) and set it up in a network to test in Linux based browsers. The only browsers I cannot test are any Apple based ones as Apples cost huge sums of money here and have less than .01% market share here. That said subscribing to a browser service as run by some members of this list can be offset to the client or absorbed as an overhead of developing CSS websites. Then when all avenues of testing have been explored locally and the site validates both X/HTML and CSS and is still breaking apart or failing in some way a request to view the site and make suggestions can be posted providing all the relevant links to the web pages. Hopefully this will be my last off topic post Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] textarea and printing
Hi all. Happy Friday :) I'm working on setting up a print version for an online QA evaluation form for my company. The problem i'm having, is that if the entered text is bigger than what the textarea can hold in physical shape/size, it obviously clips the text and is not printed. Whatever is in the scrolling part of the box is never seen. I can't have this and need to display all text. Is there a way to style a textarea to act as a p tag, or something similar, so it loses the box? Simply display it all inline instead of being in the scrolling text box? TIA __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] admin/wiki - google prepended to links
In Mozilla and SeaMonkey, and in Firefox after installation of the Chatzilla extension, entering the IRC URI irc://irc.mozilla.org/#css in the urlbar will cause the CSS channel on Moznet to open in Chatzilla. At http://css-discuss.incutio.com/?action=findfind=OffTopic at the bottom I want to add a link to the #CSS channel on Moznet. It doesn't work, because the wiki links get prepended with http://www.google.com/url? which doesn't handle the IRC URI properly (403 error Your client does not have permission to get URL /url?sa=Dq=%5Birc%3A%2F%2Firc.mozilla.org%2F%23css+irc%3A%2F%2Firc.mozilla.org%2F%23css%5D from this server). http://css-discuss.incutio.com/?page=EditingTips makes no mention of this URI prepending, and so has no discussion of avoiding it. Anyone know a solution? -- Cast your cares on the Lord and He will sustain you. Psalm 55:22 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://members.ij.net/mrmazda/auth/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Can I style generated content?
On 23/09/05, [EMAIL PROTECTED]
[EMAIL PROTECTED] wrote:
Is it possible to style generated text?
a.left-arrow:before {
content: ;
color: blue;
}
--
David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] textarea and printing
I have done this - in the css for Print media I simply set the div that scrolls to not have overflow in it - see my site: https://webdb.princeton.edu/dbtoolbox/query.asp?qname=scadmembers -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Brian Cummiskey Sent: Friday, September 23, 2005 10:14 AM To: css discuss Subject: [css-d] textarea and printing Hi all. Happy Friday :) I'm working on setting up a print version for an online QA evaluation form for my company. The problem i'm having, is that if the entered text is bigger than what the textarea can hold in physical shape/size, it obviously clips the text and is not printed. Whatever is in the scrolling part of the box is never seen. I can't have this and need to display all text. Is there a way to style a textarea to act as a p tag, or something similar, so it loses the box? Simply display it all inline instead of being in the scrolling text box? TIA __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
Kevin, The rows will go flush to the left and right if the borders are removed and the width is changed from 99.8% to 100%. Perhaps I don't understand you design objective. Jim On 9/23/05, Kevin Cannon [EMAIL PROTECTED] wrote: Hi Jim, That's almost there. The challenge i'm facing is how to get the rows to go flush to the left edge. What you've done there has got everything spot on up to that point. Do you think there's any way to persuade the those rows, to go flush to the left edge? Cheers, - Kevin On Fri, Sep 23, 2005 at 06:33:25AM -0700, Jim Davis wrote: Kevin, Here is my approach: http://www.jimdavis.org/test/locked_left.htm View source to see the css. Note that a 100% wide div with borders left and right will force a horizontal scroll bar in FF and IE 6 in standards mode. Thus the need for slightly less than 100% width if borders are used. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Can I style generated content?
On 9/23/05, [EMAIL PROTECTED]
[EMAIL PROTECTED] wrote:
Is it possible to style generated text?
/* Example: CSS */
a {
font-family: arial;
color: red;
text-decoration: none;
}
a.left-arrow:before {
content: ;
}
You can style generated content in standards-compliant browsers to a
large extent. Firefox does not support positioning generated content,
but otherwise you can change its display style, its floating/clearing,
fonts, colors, backgrounds, box model elements, and so on.
One thing to keep in mind is that :before and :after generate their
content within the main element, so if you have a border around the
tag, the generated content appears within that border.
Have fun!
Michael
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why doesn't this page work?
Nancy Smith wrote: I cannot believe how hard CSS is. I am ready to give up. What am I doing wrong? http://www.wminc.biz/newpage.htm Can anyone help me? Works on my end? http://www.dlaakso.com/sandbox/mech.html and: Captures: http://www.browsercam.com/public.aspx?proj_id=193127 Regards, ~dL -- David Laakso http://www.dlaakso.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] textarea and printing
Brian, have you used a different style sheet specifically for printed material (print/css)? On 9/23/05, Julie Angarone [EMAIL PROTECTED] wrote: I have done this - in the css for Print media I simply set the div that scrolls to not have overflow in it - see my site: https://webdb.princeton.edu/dbtoolbox/query.asp?qname=scadmembers -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Brian Cummiskey Sent: Friday, September 23, 2005 10:14 AM To: css discuss Subject: [css-d] textarea and printing Hi all. Happy Friday :) I'm working on setting up a print version for an online QA evaluation form for my company. The problem i'm having, is that if the entered text is bigger than what the textarea can hold in physical shape/size, it obviously clips the text and is not printed. Whatever is in the scrolling part of the box is never seen. I can't have this and need to display all text. Is there a way to style a textarea to act as a p tag, or something similar, so it loses the box? Simply display it all inline instead of being in the scrolling text box? TIA __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.orghttp://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/ Supported by evolt.org http://evolt.org -- http://www.evolt.org/help_support_evolt/ -- Salva veritate __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centered Layout + attached to left edge. Possible with CSS at all?
On Fri, Sep 23, 2005 at 07:34:02AM -0700, Jim Davis wrote: Kevin, The rows will go flush to the left and right if the borders are removed and the width is changed from 99.8% to 100%. Perhaps I don't understand you design objective. I didn't explain well. You haven't got a background color on the left 'columns' I need to put a bg colour in there, at the moment you've got them transparent, whereas on mine they were white and grey. - Kevin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] space in BLOCK links in IE
I started working on restyling my company's website because the
origional web designer simply used antiquated markup. I decided on using
Mark Newhouse's 3col layout in the wiki to achieve the same layout, but
without the table. I ran across a problem when I made the list items
block level items.
IE puts ridiculous spaces above and below the links, breaking up a
beautiful menu. I was wondering if anyone could help me solve this problem.
I've already tried zeroing out all margins and padding... The problem
occurs when I add:
#leftcol a, #leftcol strong, #leftcol h4 {
display: block;
}
My page is located at http://www.alumitank.com/test/warranty.htm
css : http://www.alumitank.com/test/style.css
Thanks much in advance,
Jeff Rechten
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] textarea and printing
Josue Martinez wrote: Brian, have you used a different style sheet specifically for printed material (print/css)? yes. i have a main.css for media = screen and a print.css for media=print On 9/23/05, Julie Angarone [EMAIL PROTECTED] wrote: I have done this - in the css for Print media I simply set the div that scrolls to not have overflow in it - see my site: https://webdb.princeton.edu/dbtoolbox/query.asp?qname=scadmembers This won't work for me. I'm dealing with the actual textarea/textarea form element, not a scrolling div. diego nunes wrote: Using only CSS I don't know how to achieve it, but it's very easy with JavaScript, if you can use... I can use javascript so long as its cross-browser (firefox/ie 6 on pc) and doesn't involve any onload() type functions (as i already have a huge onload and the page rendering is already suffering because of this on my machine with 512mb of ram) Thanks for the advice so far guys. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] space in BLOCK links in IE
Jeff Rechten wrote: IE puts ridiculous spaces above and below the links, breaking up a beautiful menu. I was wondering if anyone could help me solve this problem. maybe this article will help: http://www.meyerweb.com/eric/thoughts/2004/09/15/emreallyem-undoing-htmlcss/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Can I style generated content?
On 23/09/05, [EMAIL PROTECTED] wrote:
Is it possible to style generated text?
a.left-arrow:before {
content: ;
color: blue;
}
OK, I must have missed a typo earlier, I couldn't get that working, but it
is indeed making the generate the color I want.
I also encountered a problem with the generated content on hover. I tried
to remove the on hover, but I am seeing all of the other links flash
when I hovered over the link with the generarted content.
I cannot seem to figure out how to remove the on hover without making
the rest of the links in my nav flash in Firefox? Here's what I am using:
htmlbody #sidebar-nav li.selected a:before {
content: ;
}
htmlbody #sidebar-nav li.selected a:hover:before {
content: ; /*gets rid of */
}
The above works - the goes away on hover - but at the same time all
of the other links in the navigation now flash when I hover over the link
with the generated content? It appears that the other link's background
images and text color are switching to white for a split second?
Why would hovering over a link with generated content cause a flash?
Below is my HTML and CSS; I cannot currently post a link:
!-- START: sidebar navigation --
div id=sidebar-nav
ul id=navlist
lia href=page1.htmlPage 1/a/li
li class=selecteda href=page2.htmlPage 2/a/li
lia href=page3.htmlPage 3/a/li
li class=exita href=Page 4Page 4/a/li
/ul
/div
!-- END: sidebar navigation --
/* -- sidebar navigation CSS -- */
#sidebar-nav {
padding: 0;
margin: 0 0 1em 1px;
background-color: #e0efff;
color: #035ca0;
font-weight: bold;
}
#sidebar-nav ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}
#sidebar-nav li {
margin: 0;
display: inline;
}
#sidebar-nav li a {
display: block;
padding: 5px;
background: #d9e9fa url(nav_bg.gif) repeat-x bottom left;
color: #035ca0;
text-decoration: none;
border-bottom: 1px solid #90bade;
}
#sidebar-nav li.selected a {
background-color: #035ca0;
background-image: none;
color: #fff;
}
* html #sidebar-nav li a,
* html #sidebar-nav li.selected a {
height: 0.1em;
}
#sidebar-nav li a:hover,
#sidebar-nav li.selected a:hover {
background: #9ec6ef url(nav_bg_hover.gif) repeat-x bottom left;
color: #fff;
}
#sidebar-nav li.selected a:before {
content: ;
}
#sidebar-nav li.selected a:hover:before {
content: ; /* removing this stosp the flashing? */
}
#sidebar-nav li.exit a:hover {
background: #9ec6ef url(nav_bgexit.gif) no-repeat bottom right;
color: #02954f;
}
Is this a known firefox bug?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] space in BLOCK links in IE
Jeff Rechten wrote:
IE puts ridiculous spaces above and below the links, breaking up a
beautiful menu.
http://www.alumitank.com/test/warranty.htm
An old IE-bug...
Adding a 'hasLayout'[1] trigger...
#leftcol ul li a {_height: 0;}
...will cure it in your case. Tested in IE6.
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
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/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] textarea and printing
var textareasp=[];
function convertToPrint() { var i, n, tTs, nE;
tTs=gETN('textarea');
for(n=tTs.length, i=0; in; i++) {
nE=cE('p', '', 'textareabox', tTs.value);
tTs.parentNode.insertBefore(nE, tTs); nE.from=tTs;
textareasp.push(tTs); tTs.style.display='none';
}
}
function convertBack() { var i, n, tTa;
for (n=textareasp.length, i=0; in; i++) { tTa=textareasp[i];
if (!tTa.from) { continue; }
tTa.style.display=''; tTa.parentNode.removeChild(tTa.from);
}
}
adEvento(window, 'beforeprint', convertToPrint);
adEvento(window, 'afterprint', convertBack);
Unfortunately, only IE supports beforeprint and afterprint
events... You can, anyway, use a Print Page link, to make the
chances, trigger the self.print(); and then undo the mess :)
Amplexos.
On 23/09/05, Brian Cummiskey [EMAIL PROTECTED] wrote:
Josue Martinez wrote:
Brian, have you used a different style sheet specifically for printed
material (print/css)?
yes. i have a main.css for media = screen and a print.css for media=print
On 9/23/05, Julie Angarone [EMAIL PROTECTED] wrote:
I have done this - in the css for Print media I simply set the div that
scrolls to not have overflow in it - see my site:
https://webdb.princeton.edu/dbtoolbox/query.asp?qname=scadmembers
This won't work for me. I'm dealing with the actual
textarea/textarea form element, not a scrolling div.
diego nunes wrote:
Using only CSS I don't know how to achieve it, but it's very easy
with JavaScript, if you can use...
I can use javascript so long as its cross-browser (firefox/ie 6 on pc)
and doesn't involve any onload() type functions (as i already have a
huge onload and the page rendering is already suffering because of this
on my machine with 512mb of ram)
Thanks for the advice so far guys.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
--
~~ ~
diego nunes
web engineer
~ ~~
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Horizontal Menu question
Hello, I have a question to end my desperate efforts building the css for my site. Site: http://www.glorybox.de/temp/index.html CSS: http://www.glorybox.de/temp/css/main.css Screenshot IE: http://www.glorybox.de/temp/ie.jpg Screenshot Firefox: http://www.glorybox.de/temp/moz.jpg * Firefox displays nearly everything correct. While IE does not display the bottom border. How can I achieve the same on IE? I started with the menu layout copied from an A List Apart article. * Where does this gap come in front of the menu items? Maybe anyone could help me, fixing my stupid CSS work. Regards, Kai -- » http://www.glorybox.de/ PGP 1024D/594D4132 B693 5073 013F 7F56 5DCC D9C2 E6B5 448C 594D 4132 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Forms
* Rob Cochrane [EMAIL PROTECTED] [2005-09-23 01:20]: Alan Gutierrez wrote: A newbie question on styling forms. A structure question... What elements do I use to markup structure? DL/DT/DD? UL/LI? For me label is a pretty logical way of marking up forms along with fieldset all are designed to work in a form. IE has some presentation issues with legend and persists in styling it blue unless you specifically alter it to another colour. Someone with a deep knowledge of Cascading may be able to say why. Display the labels as block with width and you can then flow them, clear them all along with the inputs. Here is an excellent article: http://www.themaninblue.com/experiment/InForm/index.htm That is a nice article. Thank you to everyone who sent me pointers. I'm digesting all of them. My take... Styling forms is not straightforward. Forms are interactive not passive content. It is not straightfoward because there are only a few elements in HTML to describe forms. Forms could represent a data model that is far more more complicated that fieldsets. There are many relationships to model, not simply groups inputs, but parent/child, recursive, sequences, etc. One poster said it was really markup topic, and I suppose it is a problem of limited, not terrilby descriptive, markup. Forms are not paragraphs, and definition lists are tricky since I don't know how to markup an error message... -- Patient Billing -- [Please enter a SSN in the form XXX-XX-] SSN: [FOO! ] -- -- (I like to put error message smack above the field with the error.) I don't see how document centric markup can logically express a form layout. A box model layout like in XML makes more sense for forms or dialog boxes. I think it depends on whether the form elements are part of a document, or whether they are an application in their own right. There may be a text input that is part of a paragraph, and then it's okay to mark it up as such. If it is an application, then I guess it is a problem of layout, and if it's a problem of layout, then the same tricks used to layout the page, should be used to layout a form. (That's the approach I've decided upon: jot to be shy about positioning. I'm not saying this is correct, or starting a flame war, I know this is a list of practical CSS matters. How you approach forms, when they lack a proper representation, is a practical matter for me today.) -- Alan Gutierrez - [EMAIL PROTECTED] - http://engrm.com/blogometer/index.html - http://engrm.com/blogometer/rss.2.0.xml __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] Horizontal Menu question
* Where does this gap come in front of the menu items?
It comes from a default padding (in ff) and margin (in ie) on the ul.
This should fix it:
#bread ul {
margin-left: 0;
padding-left: 0;
}
While IE does not display the bottom border.
How can I achieve the same on IE?
Perhaps changing the height of your #bread is possible? If so, try
adding the following to #bread. You'll have to play around with the
height so that it plays nice with zooming on text, but it will get you
started.
#bread {
height: 27px;
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problem with column not floating
Hi all, I'm new to CSS, and this is my first post to the list, so apologies in advance if I miss any of the rules... I've created a 3-column layout (with header and footer) based on Ryan Brill's article in ALA on negative margins. The layout works fine in FF, but not in IE. Some of the pages (when viewed in IE) have the right column (#sidebar) not floating within the container element (#wrapper). It's forcing the #sidebar element below the container, as if there's a .clear being invoked. You can see this bad behavior at http://bluelangroup.com/postureworks/Customers.php, and a good page at http://bluelangroup.com/postureworks/Index.php. The CSS at http://bluelangroup.com/postureworks/pwstyle_v3.css. I'd appreciate any help with getting this to work - thanks! Erik __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Background image for a tag problem in IE6
Howdy, I've set up a background image with a small arrow on hyper links in my navigation. This works fine in Firefox and other Gecko browsers but I can't get it to render in IE6. Here is a page that uses it graphic-arts-schools.com/find.php http://www.graphic-arts-schools.com/find.php How do I fix this? Thanks Rich __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal Menu question
* CJ Larson [EMAIL PROTECTED]:
This should fix it:
#bread ul {
margin-left: 0;
padding-left: 0;
}
It does fix it. Thank you.
While IE does not display the bottom border.
How can I achieve the same on IE?
Perhaps changing the height of your #bread is possible? If so, try
adding the following to #bread. You'll have to play around with the
height so that it plays nice with zooming on text, but it will get you
started.
No sorry. I want it to display like that:
--
| MENU|
__
|_|
You can see this here:
http://www.glorybox.de/temp/moz.jpg
Kai
--
» http://www.glorybox.de/
PGP 1024D/594D4132 B693 5073 013F 7F56 5DCC D9C2 E6B5 448C 594D 4132
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] textarea and printing
Friday, September 23, 2005, 10:13:44 AM, Brian wrote:
the textarea can hold in physical shape/size, it obviously clips the
text and is not printed. Whatever is in the scrolling part of the box
This may fail miserably, but in your print CSS you might try:
textarea {height:auto; overflow:visible}
I imagine some browsers might let this work.
Steve
--
http://mrclay.org/ : http://thefrenchhorns.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Why does the one graphic not show up for SOME?
Thanks to Norm Loewen, Julie Angarone, and Richard Brown for taking a look at http://covinahigh68.com/testing.htm on Macs with various browsers and reporting what they saw. There should be a banner across the top, gradiating from white at the left to red at the right. Superimposed on that gradient background, there should be a red colt at the left, then text in the middle, then a white colt at the right. Some visitors, on some platforms, see no white colt. Can anyone explain why the white colt is not visible for some? Do I need a z-index or something? --Thanks, Guy K. Haas Software Exegete in Silicon Valley (working on a site for his wife's h.s. alumni group) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with column not floating
Erik Domingo wrote:
I've created a 3-column layout (with header and footer) based on Ryan
Brill's article in ALA on negative margins. The layout works fine in
FF, but not in IE. Some of the pages (when viewed in IE) have the
right column (#sidebar) not floating within the container element
(#wrapper). It's forcing the #sidebar element below the container, as
if there's a .clear being invoked.
http://bluelangroup.com/postureworks/Customers.php
IE need more breathing-space and a fix for the 'margin-doubling' bug.
Try:
#sidebar {display: inline;margin-left: -2px;}
...even a larger negative margin-left may be needed in some cases.
Otherwise a well-working layout you've got there.
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/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] Why doesn't this page work?
I cannot believe how hard CSS is. I am ready to give up.
Don't give up Nancy. CSS isn't easy but it is worth the effort to learn.
And don't let the expertise on this list fool you. At some point, we were
all beginners. The more I learn about CSS the more I know I don't know.
What am I doing wrong? http://www.wminc.biz/newpage.htm
1) Two sets of closing tags - remove one of them
/body/html
/body
/html
2) Following div ...
div id=container opened
div id=button opened
then
/div closed
div id=footer opened
/div closed
/div which closed the container id
I find I still have to indent all my div's correctly or I can't see the
opening and closings. It's part of the 'larnin' process for me, especially
when I'm taking on a new site and have multiple divs. For example, I would
have done the following with the above:
div id=container
div id=button
/div !-- close ID button --
div id=footer
/div !-- close ID footer --
/div !-- close ID container --
One thing though -- where do you plan on putting content? I see from your
CSS you plan for it. Add it in with the Latin text for filler.
3) the masthead770.gif is not in the images directory. Or maybe it's a JPG
file and not and not a GIF. Or maybe its got a capitol letter in it like
mastHead770.gif.
The first things to fix are #1 and #3.
Oh -- don't use the STRONG in a
href=aboutus.htmstrongAbout/strong/a.
If you want all those bolded on presentation then make font-weight:bold part
of the A attribute of your #button. Just add it to:
#button li a {
display: block;
padding: 5px 5px 5px 0.5em; (mixing px and .em in the padding probably isn't
a good idea)
font-weight: bold;
color: #fff;
text-decoration: none;
width: 150px;
}
Hope this helps and don't give up!
Lynda Peach
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with column not floating
Erik Domingo wrote:
Some of the pages (when viewed in IE) have the right column
(#sidebar) not floating within the container element (#wrapper). It's
forcing the #sidebar element below the container, as if there's a .clear
being invoked.
You can see this bad behavior at
http://bluelangroup.com/postureworks/Customers.php, and a good page at
http://bluelangroup.com/postureworks/Index.php.
Erik,
Zero out the margin and padding on #sidebar. Add margin and padding as
appropriate to the elements contained within the side bar instead.
Zero out the padding and margins (except the horizontal negative and
positive margin widths for the columns,i.e., #container {margint: 0
-200px 0 0;} ) on all the id's.
You *may* not need any width hacks to work cross-browser.
Regards,
~dL
--
David Laakso
http://www.dlaakso.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Re: Dropdowns in inline elements, and CSS validator problems
From: Sam Partington [EMAIL PROTECTED]
http://www.luusac.org.uk/calendar.html?new_menu
Now I've come across a strange IE glitch, where IE renders one of the
months (August) twice, even though its in the markup only once.
Any ideas?
I don't know why this works (all I did was try a few things), but if you'll
add {clear: both;} to the selector
#drop_downs div:hover span,
#drop_downs div.sfhover span
then IE seems to be willing to cooperate. If I was to hazard a guess (and it's
ONLY a guess) this appears to be a toggling behavior similar to the Guillotine
bug [1], (which sometimes can be sloved with a clearing element appropriately
placed.)
Anyway, this fix didn't seem to cause problems for my Mozilla or Opera
browsers, but if it does, just use your favorite hiding technique
Hope that helps,
~holly
[1] http://www.positioniseverything.net/explorer/guillotine.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with column not floating
Erik, I like the layout but I think you may need more contrast on this website, especially if some of your users will be elderly. Erik Domingo wrote: Some of the pages (when viewed in IE) have the right column (#sidebar) not floating within the container element (#wrapper). It's forcing the #sidebar element below the container, as if there's a .clear being invoked. You can see this bad behavior at http://bluelangroup.com/postureworks/Customers.php, and a good page at http://bluelangroup.com/postureworks/Index.php. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Newcomer to CSS
From: Nancy Smith [EMAIL PROTECTED] I did my first CSS site, and I am ready to go back to tables Please look at my site and tell me what I did wrong. I feel like such a looser - all that work and it the CSS doesn't work. http://www.wminc.biz Any suggestions would be greatly appreciated. First, your images do not appear to be located anywhere where your HTML page can find them. Second, your style sheet is being served as text/plain instead of text/css, which means that Gecko browsers (at least) will not use the styles. [1] But I suspect the bigger (third) problem may be that you have the letters HTML stuck into your style sheet at the very beginning. They are not commented out, they just sit there. This probably prevents any other browser that might forgive the text/plain from reading/displaying the styles. Only valid CSS or CSS comments may be in style sheets. Validators are your friends... [2][3] Hope that helps, ~holly [1] http://web.archive.org/web/20040715091953/http://devedge.netscape.com/viewsource/2002/incorrect-mime-types/ [2] http://jigsaw.w3.org/css-validator/ [3] http://validator.w3.org/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Background image for a tag problem in IE6
Hi Rich,
from your css:
#header ul li a {
color: #FF;
display: block;
font-variant:small-caps;
text-decoration: none;
font-weight: bolder;
font-size: .9em;
padding: 0 0 0px 20px;
margin: 0px 0 0 0;
text-align: left;
background: url(../images/chrome/arrow_bullet.gif) no-repeat scroll left
top;
margin-left: -10px;
z-index: 100;
letter-spacing: 1px;}
I'm not sure, but,
Why z-index on a float? It should only work in absolutely positioned
elements, witch is not the case...
Why margin: 0px 0 0 0; ... margin-left: -10px;?
Some clues:
FF and IE have diferent default margins on lis.
IE seams to need dimensions on floats to keep them at the flow; since you
have defined dimensions on the lis you might have no trouble giving a height
to the 'a elements';
if you do, you can give it a height of 0 hacking it to ie only (heights in
ie are actually min-heights, so don´t worry)
Didn't test it, hope it works
Isabel Santos
On 9/23/05, Rich Points [EMAIL PROTECTED] wrote:
Howdy,
I've set up a background image with a small arrow on hyper links in my
navigation. This works fine in Firefox and other Gecko browsers but I
can't get it to render in IE6. Here is a page that uses it
graphic-arts-schools.com/find.phphttp://graphic-arts-schools.com/find.php
http://www.graphic-arts-schools.com/find.php
How do I fix this?
Thanks
Rich
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org http://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/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why does the one graphic not show up for SOME?
Guy K. Haas wrote: http://covinahigh68.com/testing.htm Can anyone explain why the white colt is not visible for some? Check what screen/window-size they use. The white colt disappears into the white background at width:1400, and reappears slightly at around width:1546. So you need to define a max-width for that page, or a much wider red background. Probably need a min-width also so it doesn't get squashed. 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/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
