Re: [css-d] Fwd: Re: Making sure my container turned out
Ar 13/06/10 02:46, ysgrifennodd Thierry Koblentz : I believe the offset of relatively positioned elements is done in regard to their position in the normal flow, *not* in relation to a ancestor. They are *very* different from absolutely positioned elements. They can overlap surrounding boxes but do not disturb the flow, Yes. My bad. You're right and I didn't clarify that properly. Thanks. Normally, you would not expect to see both left and right specified: rather you would expect to see, say, left and top. It is possible to size absolutely positioned boxes via these values. For example left:10px;right:10px; will make the box stretch 10px from the left edge to 10px from the right edge of the parent that creates a positioning context. Ah! I wondered if that was the case, but had never seen it done so didn't mention it. Thanks again. I always have my heart in my mouth when answering anything on here. You lot are so knowledgeable you're not going to miss a thing! Still, it means that I learn something, as will as (hopefully) the person I'm replying to. a win-win, really, as they say. Cheers Peter -- http://www.peredur.net __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Pure CSS fisheye menu with icons: a demo
Hi all! I'm pretty inspired this time: http://onwebdev.blogspot.com/2010/06/pure-css-fisheye-menu-with-icons.html I didn't test it in IE before publishing it, though. Well, IE has its height: 100%, but I'm not sure that a#id:hover will work... thanks for your attention! bye :-) Gabriele http://www.css-zibaldone.com http://www.css-zibaldone.com/test/ (English) http://www.css-zibaldone.com/articles/ (English) http://onwebdev.blogspot.com/ (English) __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS fisheye menu with icons: a demo
Gabriele Romanato wrote: Hi all! I'm pretty inspired this time: http://onwebdev.blogspot.com/2010/06/pure-css-fisheye-menu-with-icons.html I didn't test it in IE before publishing it, though. Well, IE has its height: 100%, but I'm not sure that a#id:hover will work... thanks for your attention! bye :-) Gabriele Neat! IE/6.0 standalone on Mac 10.4 gets it. Best, ~d aside Why the elliptical method to set type? -- desktop http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS fisheye menu with icons: a demo
At 12:00 PM +0200 6/13/10, Gabriele Romanato wrote: Hi all! I'm pretty inspired this time: http://onwebdev.blogspot.com/2010/06/pure-css-fisheye-menu-with-icons.html I didn't test it in IE before publishing it, though. Well, IE has its height: 100%, but I'm not sure that a#id:hover will work... thanks for your attention! bye :-) Gabriele Gabriele: Why not use image replacement? Granted they would be larger images, but that way you load and deal with only one image per menu item. Here's an example: http://webbytedd.com/bb/replace-image2/ Cheers, tedd -- --- http://sperling.com http://ancientstones.com http://earthstones.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS fisheye menu with icons: a demo
Claude Needham wrote: It is most helpful having a live demo of the effect. That is something I missed with the first post in this thread. It is so convenient having a live page. Claude Claude, there is a link Gabriele's live demo page. I think you just didn't see it... http://dev.css-zibaldone.com/demos/pure-css-fisheye-menu-icons/demo.html Best, ~d -- desktop http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] css won't show in chrome, IEX
I made a site with a js which substitues css for different resolutions. But, IEX and Chrome won't show any css at all: http://kunstomhetlijf.nl/fileadmin/template/2010/index.html whilst firefox does show the css. Anyone know why? __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Table cell padding
I'm waving the white flag here. I'm trying to create an html table using
css attributes, and regardless of what I'm trying, I can't get rid of the
cellpadding. Shouldn't this work?
table{
padding:0px;
}
bhomis
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Table cell padding
bho...@aol.com wrote:
I'm waving the white flag here. I'm trying to create an html table
using css attributes, and regardless of what I'm trying, I can't get
rid of the cellpadding.
Did you try setting the padding of cells to zero?
Shouldn't this work?
table{
padding:0px;
}
No, it should not affect cellpadding in any way. It sets the padding of the
table element to zero, and it's normally zero anyway.
To set the padding of cells to zero, use
th, td { padding: 0; }
If you have a caption element in the table, you might want to add
caption { padding: 0; }
It's generally not a good idea to set cell padding to zero, though, at least
if you have a genuine data table. More often, you would want to set
_vertical_ padding to zero but horizontal padding so that cell contents does
not hit the cell edge. Example:
th, td { padding: 0 0.2em; }
--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS fisheye menu with icons: a demo
Claude, there is a link Gabriele's live demo page. I think you just didn't see it... http://dev.css-zibaldone.com/demos/pure-css-fisheye-menu-icons/demo.html Best, ~d sheepish grin Right you are. Sitting there in plain sight for all to see. Thanks for pointing the way to it. It is a nice effect. Reminds me of the first time I saw a Mac user interface. Claude __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css won't show in chrome, IEX
Thijs Hakkenberg wrote: I made a site with a js which substitues css for different resolutions. But, IEX and Chrome won't show any css at all: http://kunstomhetlijf.nl/fileadmin/template/2010/index.html whilst firefox does show the css. Anyone know why? Thijs, I will be the first admit that I don't exactly why it is not loading; however, if I comment -out the Dynamic Drive javascript call in the head of the document, the CSS loads in Chrome, IE/8, IE/7, and IE/6. My guess is its a js error??? Incidentally, you may want to validate the CSS. Best, ~d -- desktop http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] css won't show in chrome, IEX
I made a site with a js which substitues css for different resolutions.
But, IEX and Chrome won't show any css at all:
http://kunstomhetlijf.nl/fileadmin/template/2010/index.html
whilst firefox does show the css.
Anyone know why?
David is right, it's the script.
Try these two lines:
if(a.title == description){a.disabled = false;}
else if(a.title != default){a.disabled = true;}
instead of these:
if(a.getAttribute(title) == description){a.disabled = false;}
else if(a.getAttribute(title) != default){a.disabled = true;}
In short, get rid of getAttribute()
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pure CSS fisheye menu with icons: a demo
Hi Gabriele, I'm pretty inspired this time: http://onwebdev.blogspot.com/2010/06/pure-css-fisheye-menu-with- icons.html I didn't test it in IE before publishing it, though. Well, IE has its height: 100%, but I'm not sure that a#id:hover will work... thanks for your attention! bye :-) I'm not sure height:100% does anything, nor the 100% width on #navigation, nor display:block on the floats. Also, since you are already using padding on the anchors, why not using padding-top to make room for the larger image instead of line-height? The former would set a fixed value, but the latter may vary depending on font values. -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Basic formatting question
I have the following style in my CSS:
body {
margin: 0;
padding: 0;
border: 0;
}
#ad {
width: 275px;
height: 275px;
margin-top: 0;
margin-bottom: auto;
border: 5px black double;
background-color: red;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-size: 275%;
font-weight: bolder;
color: blue;
}
The basic html is:
div id=ad
Our business is tax.
/div
Now if I view this in browsers (IE8, FF 3.6.3), the text isn't vertically
aligned. However, if I put the text within tags (like: pOur business is
tax./p the text appears to be vertically aligned. Changing the font size to
100% again does not align. What is the trick here to get the text horizontally
as well as vertically to be aligned?
Thank you in advance for any advise on this.
_
http://clk.atdmt.com/UKM/go/195013117/direct/01/
We want to hear all your funny, exciting and crazy Hotmail stories. Tell us now
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Basic formatting question
On Sun, 13 Jun 2010, John Dick wrote:
I have the following style in my CSS:
body {
margin: 0;
padding: 0;
border: 0;
}
#ad {
width: 275px;
height: 275px;
margin-top: 0;
margin-bottom: auto;
border: 5px black double;
background-color: red;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-size: 275%;
font-weight: bolder;
color: blue;
}
The basic html is:
div id=ad
Our business is tax.
/div
Now if I view this in browsers (IE8, FF 3.6.3), the text isn't
vertically aligned. However, if I put the text within tags (like:
pOur business is tax./p the text appears to be vertically
aligned. Changing the font size to 100% again does not align. What
is the trick here to get the text horizontally as well as vertically
to be aligned?
The vertical-align property only applies to inline-level and
table-cell elements; DIV is a block-level element.
If it appears centred at some sizes, that's coincident of the
size, not of vertical alignment. Try increasing the height of the
DIV to see how that affects it.
--
Chris F.A. Johnson, http://cfajohnson.com
Author:
Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Basic formatting question
I have the following style in my CSS:
body {
margin: 0;
padding: 0;
border: 0;
}
#ad {
width: 275px;
height: 275px;
margin-top: 0;
margin-bottom: auto;
border: 5px black double;
background-color: red;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-size: 275%;
font-weight: bolder;
color: blue;
}
The basic html is:
div id=ad
Our business is tax.
/div
Now if I view this in browsers (IE8, FF 3.6.3), the text isn't
vertically aligned. However, if I put the text within tags (like:
pOur business is tax./p the text appears to be vertically aligned.
Changing the font size to 100% again does not align. What is the trick
here to get the text horizontally as well as vertically to be aligned?
You could add the following to your #ad rule:
display:table-cell;
vertical-align:middle;
but it won't work in IE6/7
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Basic formatting question
John Dick wrote:
I have the following style in my CSS:
body {
margin: 0;
padding: 0;
border: 0;
}
#ad {
width: 275px;
height: 275px;
margin-top: 0;
margin-bottom: auto;
border: 5px black double;
background-color: red;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-size: 275%;
font-weight: bolder;
color: blue;
}
The basic html is:
div id=ad
Our business is tax.
/div
Now if I view this in browsers (IE8, FF 3.6.3), the text isn't vertically
aligned. However, if I put the text within tags (like: pOur business is
tax./p the text appears to be vertically aligned. Changing the font size
to 100% again does not align. What is the trick here to get the text
horizontally as well as vertically to be aligned?
Thank you in advance for any advise on this.
It ain't easy. Please see:
http://chelseacreekstudio.com/ca/cssd/va.html
Cursory checked in FF, Safari, Opera, IE/8. Not corrected for IE/6 or IE/7.
Based on code by Georg Sortun
http://www.gunlaug.no/contents/wd_additions_20.html
Best,
~d
--
desktop
http://chelseacreekstudio.com/
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Basic formatting question
Hi David, The basic html is: div id=ad Our business is tax. /div Now if I view this in browsers (IE8, FF 3.6.3), the text isn't vertically aligned. However, if I put the text within tags (like: pOur business is tax./p the text appears to be vertically aligned. Changing the font size to 100% again does not align. What is the trick here to get the text horizontally as well as vertically to be aligned? It ain't easy. Please see: http://chelseacreekstudio.com/ca/cssd/va.html Cursory checked in FF, Safari, Opera, IE/8. Not corrected for IE/6 or IE/7. As a side note, if there was no line wrap like in your example, there would be no need to use table-cell. Because a line-height equal to the height of the container would center a single line of text vertically in all browsers, including IE6/7. -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Basic formatting question
On 6/13/10 5:17 PM, David Laakso wrote:
John Dick wrote:
I have the following style in my CSS:
[code snipped and amended below]
Now if I view this in browsers (IE8, FF 3.6.3), the text isn't vertically
aligned. ...
Thank you in advance for any advise on this.
Here is another possibility. But you will likely need to make the width
of the #ad ems rather than pixels to accommodate larger than normal
text sizes, or the text will wrap and not be centered. (But it degrades
quite well, IMHO.)
#ad {
width: 275px; /* change to em sized width */
height: 275px; /* change to 138px (half) */
margin-top: 0; /* change to padding-top 137px */
margin-bottom: auto; /* ? */
border: 5px black double;
background-color: red;
text-align: center;
/* vertical-align: middle; delete */
font-family: Arial, Helvetica, sans-serif;
font-size: 275%;
line-height: 1; /* add */
font-weight: bolder;
color: blue;
}
#ad div {
margin-top: -.5em;
}
HTML
div id=ad
divOur business is tax./div
/div
Cordially,
David
--
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
