Re: [css-d] FOUC problem?
~davidLaakso wrote: When scrolling down, and then re-loading, the page jumps to the top and simultaneously flashes the *styled* content. AFAIK, this is correct behavior. FOUC is usually associated with the CSS @import rule, which you do not seem to be using. David, obviously I used the wrong term - it should be FOSC (styled content). I remarked the flashing and concluded the wrong, the more so as FF does not behave in that way. Anyway, thank you very much for clarification. Have I nice christmas. Martin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FOUC problem?
Hi Francky,
francky wrote:
To diminish the effect, you can place the logo and the other sidebar
images in the background: then they don't show in the flash updown. :-)
I tested this with the logo (right side images not yet done).
that's a nice idea. Thank you for the example. I will certainly try that
on the right sidebar.
Then I noticed that in IE the first arrow in the list after the list
heading doesn't show. That can be repaired by adding {position:
relative} to the dl.
And thank you for the sharp view. Another way to repair that is to
insert height: 1% into an ie-stylesheet. But your method is the simple
and better way.
Have nice christmas days!
Martin
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Why does IE 7 render div margin wrongly?
Hey! This was my first IE bug, too. Have fun with the rest. (If you
read around positioniseverything you'll be prepared for most of them.)
On 12/20/06, Jeroen [EMAIL PROTECTED] wrote:
I've been learning CSS for a while and am now translating a
photoshop/illustrator design
to CSS. It renders correctly in Firefox/Opera/IE 7 but does not in IE
7 without having a dirty fix. (* html trick).
Example: http://www.home.intellit.nl/np/test
Although i have it fixed, and it works now. I don't know why IE
behaves this way.
Can someone shed some light on this, since i don't understand why IE does
this,
i won't learn from 'my' mistakes ;)
If you remove this code:
* html div.albuminfo {
margin-left: 18px; /* Fix for IE, Why does IE 7 render it wrongly?
*/
}
you'll see what i mean with rendering incorrectly; the DIV is placed
too far to the right, it looks like IE doubles the margin-left: value,
which should actually be 35px.
BTW: If someone has IE5.5 handy, i would love to hear if it renders
correctly with the fix in place. (or a mac for that matter).
Thanks!
--
Jeroen
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
--
Chris Ovenden
http://thepeer.blogspot.com
Imagine all the people / Sharing all the world
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CSS - Single or Multiple - Advise requested
Gate Wizard wrote: Currently our project uses 1 main.css which is getting to be quite large. Project: http://forums.ikonforums.com/ I have thought about splitting it into sections example: /* main.css */ /* ![CDATA[ */ @import url(style.css); @import url(structure.css); /* ]] */ /* End main.css */ My question is this: would splitting the css into smaller, more manageable files cause excessive load on browser rendering, or have other unwanted side-effects ? The reason behind splitting the css is for the user's ability to customize the skin (background gradients and colors) by changing properties in style.css while maintaining overall structure. Advise appreciated. Thank you in advance for all replies. -G7W There is some information about this topic in our wiki. http://css-discuss.incutio.com/?page=MaintainableCss Although maintainance benefits are more important, you can check the speed in the new firebug extension for firefox. Choose Net+All or Net+ CSS to see the effect [2], if any, in the timeline. HTH Ingo [1] http://www.getfirebug.com/ [2] http://www.getfirebug.com/net.html -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Applying background Image
Is it possible to put a background image to a table header using CSS. What I have noticed is that the image is applied to every cell, which I do not want. Thanks, Kavita ** This email and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you are not the intended recipient, please e-mail the sender immediately by replying to this message and delete the material from any computer. This Message is attributed to the sender and may not necessarily reflect the view of Capita Registrars, its subsidiaries or associates. If you would like to find out more about Capita Registrars, please visit our website at http://www.capitaregistrars.com Part of The Capita Group Plc. Registered Office: The Registry 34 Beckenham Road Beckenham Kent BR3 4TU Registered in England no: 2605568 ** __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Unclickable password field
[http://bssh.test.textmatters.com/login/login_form] This is driving me absolutely insane. Under IE6, the password field is not clickable. I'm told this can't be anything other than a CSS issue, and I'm tempted to agree, although nothing I've tried works. Any ideas what's screwing it up? Regards, Barney __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Unclickable password field
On 12/22/06, Barney Carroll [EMAIL PROTECTED] wrote: [http://bssh.test.textmatters.com/login/login_form] This is driving me absolutely insane. Under IE6, the password field is not clickable. I'm told this can't be anything other than a CSS issue, and I'm tempted to agree, although nothing I've tried works. Any ideas what's screwing it up? Regards, Barney Looks fine on a Mac. The input tags are not closed which could be causing it. Run it through the validators first http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/. If the problem still occurs debug by taking out rules from your CSS file until you work out which one is causing the issue. Cheers George Shape Shed | http://www.shapeshed.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Unclickable password field
At 11:04 + 22/12/06, Barney Carroll wrote: [http://bssh.test.textmatters.com/login/login_form] This is driving me absolutely insane. Under IE6, the password field is not clickable. I'm told this can't be anything other than a CSS issue, and I'm tempted to agree, although nothing I've tried works. Any ideas what's screwing it up? There are two usual causes for this kind of behaviour. 1. Something with a higher z-index is overlaying the element in question (but you just can't see it) 2. position:relative has been declared on some ancestor element and unless pos:rel is applied to some intermediate ancestor, IE hust won't play ball In your case, it looks like 2. Applying position:relative to the div whose class is infoblock seems to fix things. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Unclickable password field
Barney Carroll wrote:
[http://bssh.test.textmatters.com/login/login_form]
This is driving me absolutely insane. Under IE6, the password field
is not clickable. I'm told this can't be anything other than a CSS
issue, and I'm tempted to agree, although nothing I've tried works.
Any ideas what's screwing it up?
IE6 needs 'Layout'[1]...
There's an id with no ID or CLASS in #content, and the lack of 'Layout'
on that div makes IE lose track of where is what and stacking-order.
You may either add/correct...
#content div {height: 1%;}
#content h1.DesktopTitle {margin-top: 0;}
...or give that div a CLASS and target it directly with a 'hasLayout'
trigger. That'll make IE6 come to its senses, and probably save your
sanity too:-)
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
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Applying background Image
On 12/22/06, Raghavendhran, Kavita [EMAIL PROTECTED] wrote:
Is it possible to put a background image to a table header using CSS.
What I have noticed is that the image is applied to every cell, which I
do not want.
Yes, this will apply a background image to the entrie table:
table { background-image: url(somethiing.png); }
dcm
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [solved] Unclickable password field
Alex, Georg, you saved my life. I had tried individually applying hasLayout to the field to no effect, and thought that since the text right next to it (in fact it was possible to click within the field but only on the left-most 1px) and the other inputs were completely mouse-interactive, it couldn't be the case of a higher or adjacent object's lack of hasLayout. 2. position:relative has been declared on some ancestor element and unless pos:rel is applied to some intermediate ancestor, IE hust won't play ball I did not know this. Very useful information. Cheers, Barney __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] massive gap on the footer div
Phil Turner [EMAIL PROTECTED] wrote: Help please I cant close up the gap on the footer div I want the dotted lines on the various divs to meet up without the big white gap. You can see it here http://www.yourplanetneedsyou.org/ The padding-bottom and margin-bottom of #navbox have very large values, which is causing the problem.. Regards Sathish __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal list menu misbehaves in IE 6
Mark Baber wrote: In order to reproduce a client site, I've used ul li lists for the top navigation menu. There are special graphical images on the left AND right sides of the list items that must change when the anchor is hovered over. For that reason I added the spans in there, especially as without the spans, I can't get a li:hover background-image to show up. (But that's another problem, which I don't have to deal with at the moment.) Let's just leave the spans in there for a moment. Anyway, it all looks fine in FF 2.0, but things go strange in IE 6. I have added a special color blue so that it's obvious what happens. When you hover over the menu items in IE6, you can see that the background-color of the anchor is leaching over the top of that same anchor's background-image. To the same width as the parent li. I tried to track this down with FF Firebug, but of course that doesn't work in IE :) and I can't figure out why the blue bit extends over. It's not the padding-bottom that's causing the error - I tried changing it and that does affect something else, but not this leaching problem. The site is a subdomain: http://spip.novado.ch/squelettes/pmcbox.html Mark, I don't have time at the moment to look into this, but since you haven't received any responses yet, I wanted to point out that you *can* use Firebug in IE on your own pages, by adding a piece of JavaScript to your page while testing. Read up on it here: http://www.getfirebug.com/lite.html Also, Iyour messages says the bug occurs in IE6, but if I'm correctly interpreting your bug, I'm seeing it in IE7 as well. Can you confirm this? Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Printing problem
Hi Russ,
About the css-validation: I always see this kind of message if the
(x)html is not validating. While your page is validating now, I
suspect
it is something with the https-connection, that the css-validator
cannot
handle.
Anyway, a direct call to the css-validator is working: no errors
found,
just a bunch of warnings.
Now the real question!
The culprit is the {overflow:auto} setting of the #submain wrapper. On
screen you'll get a scrollbar, but that doesn't exist on paper. :-)
So an {overflow: visible} in a print stylesheet will do it
Success and greetings,
francky
Perfect!!! You got it Francky, thanks a ton for your help. That was it.
I added the style #submain {overflow:visible;} to override the main
style sheet and it looks great.
Russ
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] The clip property - what's the logic behind it?
On Thu, 21 Dec 2006 15:04:52 +0100, Rafael Holt wrote: I've been playing with clip recently and it seems to me the spec is a bit counter- intuitive. [...] francky replied: Hi Raphael, According to the css2.1 specs http://www.w3.org/TR/CSS21/visufx.html#propdef-clip ... a clipped element is *not* removing certain parts of the element by shrinking the margins, but is a porthole to a *defined area* of the element (mostly: image) which has to be shown. It is a bit confusing because it is a completely other way of thinking! :-) * See examples over here http://home.tiscali.nl/developerscorner/imaging/clipping-images-with-css-a.htm [...] Wow. Lots of good information there, Franky. Thank you for all your good research. The only use I have made of the clipping rectangle is to provide text animation using JavaScript[1]. Not a subject for this discussion group, but a CSS property nonetheless. When dealing with CSS layout, I think I will stick to one of the alternatives that Franky proposes, rather than attempting to use the clip property. A good question and a helpful answer. Thank you both. Cordially, David -- [1] http://webwiz.robinshosting.com/confetti.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Applying background Image
Raghavendhran, Kavita wrote: Is it possible to put a background image to a table header using CSS. What I have noticed is that the image is applied to every cell, which I do not want. Do you mean you applied the background image to the thead element? What browsers is this happening in? Can we see a page? Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] background-position
I have an object of indeterminate height whose lower right-hand corner needs to have a little background icon. The object is a list item and can have one two or three lines of text, and the image is a single non-repeating arrow - ideally I would like to specify the distance between its bottom and the li bottom, its right from the li right. Am I right in thinking this is impossible? Regards, Barney __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE6 Woes - Please Help!
Aaron Roberson wrote:
I have a two column layout with a two column nested within one of the
columns. The Headings for the outer columns are styled and rendered
correctly in IE and Firefox. The Headings in the nested columns are
another story.
http://csufresno.edu/friendsofce/layout.php
[trim]
Bunch of things, Aaron-- among them, but not limited to, setting height on h2
(not good for font-scaling), use of negative margin on h2 (not-necessary), use
of padding on width bearing containers (box model issue), and more...
These changes will not necessarily get you out of the woods. But it is a start.
The goal is to /try/ to get 6 working without hacking it up one side and down
the other.
--Delete the conditional comment for ie.
Amend (taking the horiz padding off re-calculating widths:
#news{ background-color: lime;
/*width:256px;*/
width: 309px;
/*padding:20px; padding-left:33px;*/
padding: 20px 0 20px 0;
float:left;
}
Add this ruleset:
#news p {
padding: 0 20px 0 33px;
}
Amend:
#news h2{
color:#b5a967;
/* height:24px; */
background:#8c;
/*margin:10px -20px; padding:10px; */
margin: 0; padding: 20px 0 20px 30px;
}
Amend:
#summary{ background-color: fuchsia;
/*width: 605px; */width: 645px;
/*padding:20px;*/
padding: 20px 0;
float:right;
}
Add this ruleset:
#summary p {
padding: 0 20px;
}
Amend:
#summary h2{
color:#b5a967;
/*height:24px;*/
background:#1f3651;
/*margin:10px -7px 10px -20px; padding:10px;*/
margin: 0; padding: 20px 0 20px 20px;
}
Amend:
#support{
clear:both;
float:left;
/*width:245px;*/
width: 278px;
border-right:1px solid #ccc;
/*padding:10px; padding-top:0;*/
padding: 0 0 10px 0;
/*margin-left:-10px; */
}
Add this ruleset:
#support p {
padding: 0 10px;
}
Amend:
#support h2{
color:#b5a967;
/*height:24px;*/
background:#8c;
/*margin:0 -20px; padding:10px; */
margin: 0; padding: 20px 0 20px 20px;
}
Amend:
#founder{
width:365px;
float:right;
/*padding:10px; padding-top:0;*/
padding: 0 0 10px 0;
}
Add this ruleset:
#founder p {
padding: 0 10px;
}
Amend:
#founder h2{
color:#b5a967;
/*height:24px;*/
background:#1f3651;
/*margin:0 -17px 10px -20px; padding:10px; */
margin: 0; padding: 20px 0 20px 20px;
}
I am not able to remember what I forgot :-) .
HTH,
~dL
--
http://chelseacreekstudio.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE6 Woes - Please Help!
Aaron Roberson wrote:
http://csufresno.edu/friendsofce/layout.php
1: IE6' 'margin-doubling on float' bug for #support.
Add...
#support{display: inline;}
...and delete...
!--[if lte IE 6]
style type=text/css
#support{
width:255px;
}
/style
![endif]--
...since it won't be needed anymore.
2: both h2's suffers from IE's 'stacking problems'.
Add...
#support h2, #founder h2{position: relative;}
...to fix that bug.
That should be it, resulting in identical rendering across browser-land.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Footer problem with 3 col layout
Happy Holidays to everyone.
I'm trying to convert my volunteer site from tables to CSS. I used the
example on http://www.positioniseverything.net/guests/3colcomplexside.html
for my base. The footer for the layout was in the container div, but I want
mine to go across the bottom. I added a clear div that I thought was going
to push it down, but it's not working. I'm a newbie and appreciate any help
you can offer so I can get to the real work of updating the content. GoLive
has mangled the code with extraneous divs. They have multiplied like
bunnies. :-)
Not sure if this is part of the same positioning question, but I need all
the columns to be of equal height. I just don't know enough to understand
where the problem is located.
I tried putting the cleardiv2 before and after contents, but the results
were the same.
You can view page (obviously rough) here:
http://www.test.entourage.mvps.org/
--
div id=cleardiv2/div
/div!--this is the end of container--
div id=footer
footer info goes here
/div
div id=bottom/div
/body
CSS
#cleardiv2
{
clear: both;
height: 1em;
}
/**Begin Footer**/
div#footer {
border-top: 2px solid #5C73BA;
text-align: center;
}
Great listI'm learning a lot.
--
Diane
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Site check: IE5 on Mac9.x needed
Mary Ellen Curtin wrote: Yes! that works. I still don't understand why the login box's position:absolute caused the problem -- I mean, pos:abs is supposed to take it right out of the document flow, right? Yes, but absolute positioned elements are positioned relative to something, and the relation - and thereby also the position wasn't the right one. Stacking/layering and thereby visibility can be affected in most browsers if we get such relations wrong, and IE/Mac had most problems with it this time. I lost partial/total sight of that table in several browsers, while checking for those relations. And the client says it's still acting as though the paragraph below the floatwrap is still inside the left float. This doesn't show up on browsercam -- is it something where I have to move around the screen to activate? Can't see any problems in my IE/Mac version (or any other of my browsers), and I don't have access to OS9. That paragraph can become pretty narrow - down to one word width - on very narrow windows though, since neither IE/Mac nor IE6/win understands 'min-width'. http://tinyurl.com/ttxgq May be worth fixing the source-code though, as it isn't XHTML... http://validator.w3.org/check?uri=http://thelawyersleague.com/ ...and some browsers may not be able to handle and correct all 36 errors. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CDATA?
On 23/12/06, Chris Pallé [EMAIL PROTECTED] wrote: Hi All, I have a question regarding this bit of syntax I see several people using: /* ![CDATA[ */ css stuff here /* ]] */ The only time I've used CDATA is creating a DTD. What is it's usefulness/purpose here? You need to use CDATA containers to allow inline CSS/JavaScript content to validate when checking XHTML documents[1]. [1] http://www.w3.org/TR/xhtml1/#h-4.8 -- Cheers, Sasha __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CDATA?
On 22/12/06, Chris Pallé [EMAIL PROTECTED] wrote: The only time I've used CDATA is creating a DTD. What is it's usefulness/purpose here? XML DTDs don't allow elements to be specified as containing CDATA, so you have to be explicit in the document that the content is CDATA or use entities to represent any or characters in the stylesheet. If you are serving the XHTML document as text/html then things get rather more complicated. Its easier to use link elements with external stylesheets instead (and to use HTML 4.01). -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Negative background position: pixels work, percent doesn't...?
Stephanie Leary wrote: Thanks, Ingo. I'm sure this will start making sense after a couple more aspirin... Hi Stephanie, Good news: you can forget the aspirin, and even no coffee needed! ;-) After some days of scratchin' my head I got the aha! for the simple css solution that I was feeling to be present. First: we forget the background-image to be shifted left or right with a certain %. Second: then we can forget the exact computing of it in px (by hand or by javascript). Third: a background-position in a % has its own rules, as Ingo explained. - But a simple p we can give a width of a % of the containing element, no px needed. So we can style a p line with a content of the % number ... as inline-block with that % as width. We give this p a background-color ... and: ready! :-) * Here is the example http://home.tiscali.nl/developerscorner/css-discuss/test-progress-test_a.htm And now we have made this, we can add a background-img to this p which has already the % width (the background cannot peep out of this width). For instance the well known Windows progress blocks: * Example 2 http://home.tiscali.nl/developerscorner/css-discuss/test-progress-test_b.htm Or you can make your own variants (free to choose aligned left or aligned right): * Example 3 http://home.tiscali.nl/developerscorner/css-discuss/test-progress-test_c.htm * Example 4 http://home.tiscali.nl/developerscorner/css-discuss/test-progress-test_d.htm I think in this way (% as inline-style!) it's easy to adapt the page every now and then with the actual data - without calculator, without javascript, and without much chance to make errors (the % has to be put in the html twice, but just in the same line: easy to change). The only beauty error is in IE: at small %%, IE is extending the width (as usual for IE) of the p-background to the width of the text inside. At about 14% or 15% the % is exactly the indicated % of the width of the bar. But assuming this progress bar is not for scientific purposes, there is no need to fix IE, and I guess everybody can live and/or sleep with it. Whishing you good days [1], francky [1] Time to read Ingo's story and links at ease, without aspirine. ;-) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Negative background position: pixels work, percent doesn't...?
Hi Stephanie, Here good news part II: screenshots came back, and Saphari is taking it, as well as other browsers. * Results browsershots.org http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-progress-test_a.htm francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Footer problem with 3 col layout
Diane Ross wrote: I'm trying to convert my volunteer site from tables to CSS. I used the example on http://www.positioniseverything.net/guests/3colcomplexside.html for my base. The footer for the layout was in the container div, but I want mine to go across the bottom trimmed]. Not sure if this is part of the same positioning question, but I need all the columns to be of equal height. I just don't know enough to understand where the problem is locatedtrimmed] http://www.test.entourage.mvps.org/ I don't know what the footer solution is with that particular layout. If you are not far along, and can, or are willing to switch layouts, the 3 column layout on this page http://alistapart.com/articles/negativemargins includes a footer across the entire bottom, and the tutorial explains the use of images to create faux columns for it. It is similar to (but a little different) than what you are using. If you prefer a fixed width, or min/max width layout, wrap the whole ball of wax within a containing division with an appropriate width assigned to it. This navbar http://css.maxdesign.com.au/listamatic/horizontal16.htm is cross-browser reliable, too-- and will work well with the negative margin layout: http://css.maxdesign.com.au/listamatic/horizontal16.htm. Best, ~dL -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] CDATA?
This is very interesting. I installed a Google map into my site last weekend, and it used CDATA. I wondered what it was for, but didn't investigate. It also had some proprietary code for microsoft, but I deleted it and it still seems to work fine. The Google code seems to have validation errors whenever it sees a closing tag in one of the map's point's text balloons, but I wasn't going to worry about it. Merry Christmas, R.B. Gottier Temecula, CA Hi All, I have a question regarding this bit of syntax I see several people using: /* ![CDATA[ */ css stuff here /* ]] */ The only time I've used CDATA is creating a DTD. What is it's usefulness/purpose here? THanks chrispallé blueflamecreative* http://blueflamecreative.com http://www.linkedin.com/in/chrispalle __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pitfalls of overflow
On 20/12/06, Barney Carroll [EMAIL PROTECTED] wrote:
Hi Raf,
This site is fantastic - there's loads of fantastic little bits of css
here I'd like to pull apart. The overflow selector for the drop-down
menu is very, very cool.
Sadly this wouldn't work for me because I can't select the parent of a
:hover element (besides, the flyouts are only revealed after the a -
they're not hover-based), and in any case toggling the overflow would
cause the page to become 3 pixels high.
Regards,
Barney
Hi Barney
I'm glad you liked it, I've been at it for a few weeks now. Unfortunately I
keep adding more complex CSS to it that only Firefox, Opera and Safari
understand and I fear the fix for IE6 is going to be a hell of a job! I'll
just have to add more classes and ids for it.
This is an area where I think CSS is quite deficient. The inability to
affect the parent of something like you say. Something like #item
div:hover {color:red;} would be nice, and I've wanted it before (where
selects the parent). Unfortunately it seems like you might have to resort to
javascript. You can't just apply :hover to the parent directly?
All the best,
Rafael
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
