Re: [css-d] centering bordered image
XtiaN wrote:
I have prob here centering my image(s)
i can't see my padding in .img-bdr img (IE7).
style
.img-bdr {
text-align: center;
margin: 0 auto;
width: 100%;
}
.img-bdr img{
margin: 0 auto;
padding: 3px;
border: 1px solid #ddd;
display: block;
}
/style
div class=img-bdr
img src=/images/5.jpg /
/div
I think you aren't using a doctype declaration.
Add this to the top of your document and the padding will be seen
even in IE:
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
http://www.w3.org/TR/html4/strict.dtd;
--
Els
http://locusmeus.com/
http://locusoptimus.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Form Layout how would *you* do this? question...
Les Mizzell wrote: What I'm trying to get is: http://www.columbiacityjazz.com/LEV4_VOUCHERS_DIV_STEP2.gif I've set it up like this: div class=ROW span class=fltLEFTLong Distance Telephone Calls/span span class=fltRIGHTinput type=text name=whatever/span /div The left/right aligned columns isn't the problem. It's the darned dotted line between them. This same configuration takes place in dozens of places - Class ROW is 600 pixels wide. The width of the left/right content could be split 200px/400px or 450px/150px - could be anything and content could be anything on either side...multiple text boxes, just text Greetings Les, Current I get a can't connect server error when trying to access the link. -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Form Layout how would *you* do this? question...
Schalk wrote: Les Mizzell wrote: http://www.columbiacityjazz.com/LEV4_VOUCHERS_DIV_STEP2.gif Greetings Les, Current I get a can't connect server error when trying to access the link. Schalk: I can connect just fine to the server. Rahul. -- . . . . . . . . . . . . . . . . . . . . . . . . Rahul Gonsalves Make PNG, not War. . . . . . . . . . . . . . . . . . . . . . . . . __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] safaritest page check
Hi Bob On 21 Feb 2006, at 05:07, [EMAIL PROTECTED] wrote: Can someone do a sanity check for me on the menu on the site, Unfortunately the sanity check was needed! Take a look at: http://www.throwupdontgrowup.co.uk/tPicture8.jpg -- Rich http://www.cregy.co.uk Embracing what God does for you is the best thing you can do for him. Romans 12 v 1 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Out damned dots!
I have a border-bottom: 1px dotted #bbb; style applied to my
links. I only want the style applied to text links, not image
links. My problem is: How do I get it turned off image links?
a:link{border-bottom:1px dotted #bbb;}
a:link img{border-bottom:none;}
That doesn't work in decent browsers. The image is a child of the
a, meaning, the dotted border stretches around the image.
Frankly admitted - I did not understand that phrase until after testing
the scenario. I do not intent to say that it should have been stated
otherwise, only that others than me _might_ miss the influence of the
image being a child, and thus the point :-)
IF anybody else is in doubt, they might benefit from a rephrasing:
It is only the img that's declared borderless with a:link
img{border-bottom:none;}, whereas the a still has (and shows) the
border. The solution has to apply to the a, as Philippe Wittenbergh
suggested:
a.noborder {border-bottom:none}
a class=noborderimg src= alt=.../a
I hope this clarifies the matter to others than myself :-)
Best regards
Jesper Brunholm
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Layout question 2 column content with image
Hi all, A time ago I've seen a toturial of how te make this in CSS but I've lost the page I hope someone can tell how to do this... I whanna make this http://www.johnsten.com/test/images/voorbeeld.jpg Regards. Sander __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Layout question 2 column content with image
A time ago I've seen a toturial of how te make this in CSS but I've lost the page I hope someone can tell how to do this... I whanna make this http://www.johnsten.com/test/images/voorbeeld.jpg I'd use a ul with a fixed width (enough for both columns) and then float each li left. Regards Mark Howells www.permanenttourist.ch __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] page check please
Greetings everyone! I believe I have sorted out all of the problems with these pages but, to make sure, I would appreciate it if I can get one last check done on the following two pages: www.volume4.com/fc/ www.volume4.com/fc/entry_archive.html CSS www.volume4.com/fc/css/standards.css www.volume4.com/fc/css/forms.css www.volume4.com/fc/css/ie.css Thanks! -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Float box width depending on with image
What I want is this: A box with an image in the boxImg div. That div should be 100px when the image is 100px and 200px when the image 200px. I have to float the boxImg when I want the text next to the image and when floating I have to give boxImg a specific width. So I think what i want is not possible but I hope it is. One solution could be floating only the image and let the text go round it but that's not what I want. I tried several things but nothing gave me the result I wanted. Source code: div class=box div class=boxImgimg //div !-- end .boxImg -- div class=boxTxt psmaple text/p /div !-- end .boxTxt -- /div !-- end .box -- To create something like this: http://ischagast.nl/img/example-01.gif http://ischagast.nl/img/example-02.gif __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Float box width depending on with image
A lot of thinking has been done here.. watch:
1. I think you want an image next to your text, that doesn't allow
wrapping around it and of which the height resizes along with the text
as more appears..
2. I -think- something like this should work if that is case: (I'm just
typing from the top of my mind, so if it doesn't let me know and I'll
look it up)
div.box
{
overflow: hidden;
}
div.boxImg
{
float: left;
padding: 0 0 2px 0;
margin: 0 0 -2px 0;
}
From what I think to remember the text box should automagically wrap
against the image div now, as said.. I'll give you a working solution if
this fails, lemie know.
-Rian
On Tue, 2006-02-21 at 04:13 -0800, Ischa Gast wrote:
What I want is this:
A box with an image in the boxImg div. That div should be 100px when the
image is 100px and 200px when the image 200px.
I have to float the boxImg when I want the text next to the image and when
floating I have to give boxImg a specific width. So I think what i want is
not possible but I hope it is.
One solution could be floating only the image and let the text go round it
but that's not what I want.
I tried several things but nothing gave me the result I wanted.
Source code:
div class=box
div class=boxImgimg //div !-- end .boxImg --
div class=boxTxt
psmaple text/p
/div !-- end .boxTxt --
/div !-- end .box --
To create something like this:
http://ischagast.nl/img/example-01.gif
http://ischagast.nl/img/example-02.gif
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
Met vriendelijke groeten,
Meyson Communicatie
Rian Orie
[EMAIL PROTECTED]
Meyson Communicatie BV erkend bureau
Postbus 94077
1090 GB Amsterdam
Joop Geesinkweg 851
1096 AZ Amsterdam
Tel. (020) 561 22 00
Fax (020) 561 22 59
ISDN (020) 362 31 69
www.meyson.nl
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] page check please - forgott
Schalk wrote Tue, 21 Feb 2006 12:30:45 +0200: I believe I have sorted out all of the problems with these pages but, to make sure, I would appreciate it if I can get one last check done on the following two pages: http://www.volume4.com/fc/ http://www.volume4.com/fc/entry_archive.html CSS www.volume4.com/fc/css/standards.css www.volume4.com/fc/css/forms.css www.volume4.com/fc/css/ie.css Open Firefox, Mozilla or SeaMonkey. Set the default back to 16px if you've changed it to anything else. Set the window width to 800px wide. Now open those pages and look. Try zooming down (smaller) one step. Do you see any layout problems? I'd probably knock #outer back to something around 20% narrower. -- Love your neighbor as yourself.Mark 12:31 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/auth/auth __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Layout question 2 column content with image
But how do you arange that you only have 2 li's per colomn ? The layout would be like this: 12 34 56 78 ... and so on: make the LIs (for example) 150px wide, and the containing UL 300px wide. Then they're forced to wrap. Make sure to set margin and padding appropriately for all elements! Regards Mark Howells www.permanenttourist.ch __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] page check please
Schalk wrote: I believe I have sorted out all of the problems with these pages but, to make sure, I would appreciate it if I can get one last check done on the following two pages: www.volume4.com/fc/ www.volume4.com/fc/entry_archive.html Schalk, It sees to be doing well in linux debian-- konqueror/firefox/opera. A couple of suggestions: 1/ At higher screen resolutions the background image does not fill the screen. You might reduce the 850px width to something more reasonable for faster load and set it to repeat. 2/ The page is perfectly usable at 800. However, you are drawing a horizontal scrollbar at that resolution due to the 61em(976px) width of the outermost container(I've got a thing about h-scroll bars that not everyone else shares). 3/ The blue text could use more contrast, IMO. Regards, ~davidLaakso __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Content to footer divs and IE bullet problems
Hi, Couple of CSS conundrums I need solved: Page: http://www.homes2view.biz/dev/index.php CSS: http://www.homes2view.biz/dev/css/styles.css 1. I've managed to get the footer to rest on the bottom of the page after many hours searching for answers, I need the #content div (The main text area) to follow on down to the footer so that the grey bg and border finishes on the top border of the footer. 2. The top of the page has the date and directly below that are three bullet points with my own specified bullet image, it looks good in FireFox but in IE the bullets cling to the text, any ideas what I can do to make it look like it does in FireFox. Any more information needed please ask, thanks in advance. Stuart __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] page check please
David Laakso wrote: Schalk wrote: believe I have sorted out all of the problems with these pages but, to make sure, I would appreciate it if I can get one last check done on the following two pages: www.volume4.com/fc/ www.volume4.com/fc/entry_archive.html Schalk, It sees to be doing well in linux debian-- konqueror/firefox/opera. A couple of suggestions: 1/ At higher screen resolutions the background image does not fill the screen. You might reduce the 850px width to something more reasonable for faster load and set it to repeat. 2/ The page is perfectly usable at 800. However, you are drawing a horizontal scrollbar at that resolution due to the 61em(976px) width of the outermost container(I've got a thing about h-scroll bars that not everyone else shares). 3/ The blue text could use more contrast, IMO. Regards, ~davidLaakso Greetings All! On point 1: Now why didn't I think of that! :) On point 2: I agree with Felix and David here however, the client wants the site to be optimized for 1024x768 and demanded the width I am using as the min width. On point 3: I agree, maybe bold will help? Not sure though. Thanks for everyones input. -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Content to footer divs and IE bullet problems
Stuart Swan wrote: Hi, Couple of CSS conundrums I need solved: Page: http://www.homes2view.biz/dev/index.php CSS: http://www.homes2view.biz/dev/css/styles.css 1. I've managed to get the footer to rest on the bottom of the page after many hours searching for answers, I need the #content div (The main text area) to follow on down to the footer so that the grey bg and border finishes on the top border of the footer. 2. The top of the page has the date and directly below that are three bullet points with my own specified bullet image, it looks good in FireFox but in IE the bullets cling to the text, any ideas what I can do to make it look like it does in FireFox. Greetings Stuart, As for number 1, check out this article: http://www.alistapart.com/articles/fauxcolumns/ -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Content to footer divs and IE bullet problems
Stuart Swan wrote: Hi, Couple of CSS conundrums I need solved: Page: http://www.homes2view.biz/dev/index.php CSS: http://www.homes2view.biz/dev/css/styles.css 1. I've managed to get the footer to rest on the bottom of the page after many hours searching for answers, I need the #content div (The main text area) to follow on down to the footer so that the grey bg and border finishes on the top border of the footer. Greetings Stuart, Just checked and site and if you resize to 800x600 the footer overlaps the content in Firefox. Have not checked in IE. -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] page check please
Schalk wrote: David Laakso wrote: Schalk wrote: believe I have sorted out all of the problems with these pages but, to make sure, I would appreciate it if I can get one last check done on the following two pages: www.volume4.com/fc/ www.volume4.com/fc/entry_archive.html Schalk, 3/ The blue text could use more contrast, IMO. Regards, ~davidLaakso Greetings All! On point 3: I agree, maybe bold will help? Not sure though. On point 3: Bump the font-size, not the weight-- use a color picker to pull a blue from the 'blue' cartoon? FWIW, think deep 'cornflower blue.' (God I love this stuff that has nothing to do with css.) ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how could I center a div layer
Hi, I'm trying to center a relative position div. What could I do?
here is the CSS:
div.footer {
width : 720px;
margin-left : auto;
margin-right : auto;
position : fixed;
z-index : 1;
bottom : 0px;
text-align : center;
}
This is the XHTML:
...
div class=footerFooter/div
...
this div should be centered and attached to the bottom border.
I'm new to xhtml+css, so I'm sure that I'm missing something :)
Bye
Lorenzo
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] how to keep footers at the bottom
Thanks in advance for any help. I'm trying to create a site that requires a horizontally stretching footer that is pinned to the bottom of the browser port. This I understand is a common issue in CSS design when a tables-based layout is not used. I referenced the article Exploring Footers by Bobby Van Der Sluis on alistapart.com and found the information useful, but I was still coming up with some bugs. Specifically, certain pages still sometimes render with the footer not pinned to the bottom but rather somewhere in the middle of the content, overrunning other content on the page. It doesn't do it consistently, mostly when you resize the browser window and then click to a page already visited, its as if the browser cache thinks the browser is still the former size and resolves the site based on that previous size. The test site is here: http://dev.gelatincube.com/gcpsiro/ Style sheet is here- http://dev.gelatincube.com/gcpsiro/common/master.css A screenshot of the problem is available here- http://dev.gelatincube.com/gcpsiro/img/fubarfooter.jpg The site uses an absolute positioned (bottom: 0) footer inside a relative positioned container item (#container). It works most of the time in Safari 2, Firefox 1.5, IE6. It fails in older versions of Firefox (1.01) and predictably in IE7Beta2 I guess because of the overflow: visible fix and lack of support for min-height. It also fails in IE5/5.5 because I did not bother to hack for those browsers. My goal here is to make this footer work 100% of the time in IE6, Safari 2 and Firefox 1.5. Again, thanks for any help. - Ben __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how could I center a div layer
Lorenzo,
Visit this demo for inspiration:
http://www.456bereastreet.com/lab/cssframes/
Jim
On 2/21/06, Lorenzo Giuliani [EMAIL PROTECTED] wrote:
Hi, I'm trying to center a relative position div. What could I do?
here is the CSS:
div.footer {
width : 720px;
margin-left : auto;
margin-right : auto;
position : fixed;
z-index : 1;
bottom : 0px;
text-align : center;
}
This is the XHTML:
...
div class=footerFooter/div
...
this div should be centered and attached to the bottom border.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] how to keep footers at the bottom
Thanks Jim, That's an interesting solution. I'm discussing it with the designer right now. We prefer to keep the footer pinned to the bottom and having the entire page scroll rather than the center content, however, we may need to consider it if we cannot find a solution exactly as we desire. - Ben On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote: Ben, See this demo for a possible solution: http://www.456bereastreet.com/lab/cssframes/ Jim On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote: Thanks in advance for any help. I'm trying to create a site that requires a horizontally stretching footer that is pinned to the bottom of the browser port. T __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
Ben, Try this page as well. http://www.fu2k.org/alex/css/frames/ Alex has done a lot more playing with this and helped me solve a problem that Roger's didn't address. -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 Ben Liu [EMAIL PROTECTED] Sent by: [EMAIL PROTECTED] 02/21/2006 10:38 AM To: Jim Davis [EMAIL PROTECTED] cc: css-d@lists.css-discuss.org Subject:Re: [css-d] how to keep footers at the bottom Thanks Jim, That's an interesting solution. I'm discussing it with the designer right now. We prefer to keep the footer pinned to the bottom and having the entire page scroll rather than the center content, however, we may need to consider it if we cannot find a solution exactly as we desire. - Ben On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote: Ben, See this demo for a possible solution: http://www.456bereastreet.com/lab/cssframes/ Jim On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote: Thanks in advance for any help. I'm trying to create a site that requires a horizontally stretching footer that is pinned to the bottom of the browser port. T __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] page check please - forgott
A little extra work perhaps, but you could offer an alternate stylesheet- one of 800x600 and the other for 1068. Then let the viewer make the choice. Educate your client. Assumptions are key. Who is your client's audience (rhetorical)? Felix Miata wrote: Schalk wrote Tue, 21 Feb 2006 16:29:16 +0200: http://www.volume4.com/fc/ http://www.volume4.com/fc/entry_archive.html On point 2: I agree with Felix and David here however, the client wants the site to be optimized for 1024x768 and demanded the width I am using Does he know about sidebars and people who don't browse fullscreen? http://mrmazda.no-ip.com/SS/schalk5.jpg __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
the best footer solution i've seen is from http://www.themaninblue.com/experiment/footerStickAlt/ and doesn't require absolute positioning. make sure you view *his* examples, which are the bottom two he lists (Alt). the first two show the footer code he started from, which was buggy. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
Thanks Jim, I see how that now allows the header to scroll with the
rest of the page. However, the footer is still not behaving exactly as
we would like. It is seems to be a working solution, but wow, with a
lot of hacks though.
- Ben
On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote:
Ben,
Just change one line:
/* position:fixed for modern browsers - header and footer do not scroll */
bodydiv#headerwrap {
position:absolute;--- change from fixed to absolute
Jim
On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote:
Thanks Jim,
That's an interesting solution. I'm discussing it with the designer
right now. We prefer to keep the footer pinned to the bottom and
having the entire page scroll rather than the center content, however,
we may need to consider it if we cannot find a solution exactly as we
desire.
- Ben
On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote:
Ben,
See this demo for a possible solution:
http://www.456bereastreet.com/lab/cssframes/
Jim
On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote:
Thanks in advance for any help. I'm trying to create a site that
requires a horizontally stretching footer that is pinned to the bottom
of the browser port. T
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] how to keep footers at the bottom
Thanks Mark, I'm looking into this now. Appears to be similar to the suggested site Jim referenced, just with some IE specific javascript in the CSS. - Ben On 2/21/06, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Ben, Try this page as well. http://www.fu2k.org/alex/css/frames/ Alex has done a lot more playing with this and helped me solve a problem that Roger's didn't address. -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 Ben Liu [EMAIL PROTECTED] Sent by: [EMAIL PROTECTED] 02/21/2006 10:38 AM To:Jim Davis [EMAIL PROTECTED] cc:css-d@lists.css-discuss.org Subject:Re: [css-d] how to keep footers at the bottom Thanks Jim, That's an interesting solution. I'm discussing it with the designer right now. We prefer to keep the footer pinned to the bottom and having the entire page scroll rather than the center content, however, we may need to consider it if we cannot find a solution exactly as we desire. - Ben On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote: Ben, See this demo for a possible solution: http://www.456bereastreet.com/lab/cssframes/ Jim On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote: Thanks in advance for any help. I'm trying to create a site that requires a horizontally stretching footer that is pinned to the bottom of the browser port. T __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
Hi cj, This looks more like what I need. Absolute positioning never seemed entirely ready for primetime to me, especially due to spotty browser implementation. I'll take a crack at my site using this technique and post back. - Ben On 2/21/06, cj [EMAIL PROTECTED] wrote: the best footer solution i've seen is from http://www.themaninblue.com/experiment/footerStickAlt/ and doesn't require absolute positioning. make sure you view *his* examples, which are the bottom two he lists (Alt). the first two show the footer code he started from, which was buggy. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
I've implemented the man-in-blue footerStickAlt technique on my test site and it seems to work quite well in Safari, IE5.5/6, breaks in IE7beta2 as expected. However, on my test site homepage (http://dev.gelatincube.com/gcpsiro/index.php) I use absolute positioning on the main content area to create two columns. On this particular page, the technique breaks. So I guess I might have to position the two columns relatively and float them to achieve two columns and then make the footer clear both floats. Gonna try that now. Solution seems close at hand, thanks to all. - Ben On 2/21/06, cj [EMAIL PROTECTED] wrote: the best footer solution i've seen is from http://www.themaninblue.com/experiment/footerStickAlt/ and doesn't require absolute positioning. make sure you view *his* examples, which are the bottom two he lists (Alt). the first two show the footer code he started from, which was buggy. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Clearing internal floats
Yeah, sorry. My fault for trying to do anything meaningful at 10:30PM! There is one difference though: the green div is inside another div, page, that sits between it and the sidebar in the div hierarchy. I'll remove that and see where floating gets me. Yes, I'm trying to make the green area expand to contain the floated image on the right (i.e. clear the internal float). And I also want the content to take up the space below the sidebar, as I sometimes end up with very long posts (http://www.steamreview.org/index.php?paged=2) that look silly wasting the space. --- Els [EMAIL PROTECTED] wrote: As far as I can see, the sidebar _does_ come before the content in the above example. At the url you gave in your other post - http://www.steamreview.org/files/newstyle.htm , I see the same construct as in my example. What is your goal? extend the green area to encompass the image? Looking at your main page - do you want the posts to take up the space below the sidebar? -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Need help with CSS menu in IE6
Hello, I'm implementing a navigation menu in CSS in the left column of the page. One menu item (the last one, Join Blackstock) is a drop down, or fly-out. It works fine in Firefox, but the submenu won't display in IE 6. I'm sure there's something I'm missing. Here's a link to the page: http://www.webdesignpartners.com/blackstock/index.html Thanks! Phil __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] how to keep footers at the bottom
Thanks again all, I've got it working now, seems fairly rock solid as long as I don't resize the browser window violently. Woohoo. - Ben On 2/21/06, Tom Payne [EMAIL PROTECTED] wrote: Ask the Man in Blue http://www.themaninblue.com/writing/perspective/2005/08/29/ :) On 21 Feb 2006, at 15:38, Ben Liu wrote: Thanks Jim, That's an interesting solution. I'm discussing it with the designer right now. We prefer to keep the footer pinned to the bottom and having the entire page scroll rather than the center content, however, we may need to consider it if we cannot find a solution exactly as we desire. - Ben On 2/21/06, Jim Davis [EMAIL PROTECTED] wrote: Ben, See this demo for a possible solution: http://www.456bereastreet.com/lab/cssframes/ Jim On 2/21/06, Ben Liu [EMAIL PROTECTED] wrote: Thanks in advance for any help. I'm trying to create a site that requires a horizontally stretching footer that is pinned to the bottom of the browser port. T __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-d Digest, Vol 39, Issue 46
Thx, Ingo! :-) I was just worried, am I missing something important in CSS and IE 7 is right, or IE is wrong and my code is correct! Of course, nothing to fix, beta is just beta, now I know CSS is ok;-) Thanks again! Michel Mikhail Bozgounov wrote: http://www.bluelink.net/zero-waste/ horizontal scrollbar? Date: Mon, 20 Feb 2006 13:34:26 +0100 From: Ingo Chao [EMAIL PROTECTED] a.p. boxes that have a right:value set seem to cause scrollbars in IE7b2preview. Funny thing is that overflow:hidden on this box stops the bug; that would be #motto in your case. Ingo __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Need help with CSS menu in IE6
Phil Winter wrote: Hello, I'm implementing a navigation menu in CSS in the left column of the page. One menu item (the last one, Join Blackstock) is a drop down, or fly-out. It works fine in Firefox, but the submenu won't display in IE 6. I'm sure there's something I'm missing. Here's a link to the page: http://www.webdesignpartners.com/blackstock/index.html Thanks! Phil Have a look at this: http://www.alistapart.com/articles/horizdropdowns/ HTH! -- Kind Regards Schalk Neethling Web Developer.Designer.Programmer.President Volume4.Business.Solution.Developers __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Div overlap of floated image
Web page at: http://vicrauch.com/Untitled-2.htm and css at: http://vicrauch.com/css/Untitled-1.css Photo that is floated right on this page is being overlaid by a div on the left, but I can't figure out how to stop it. Of course it works OK in FireFox. Any help greatly appreciated! Vic __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Navbar problems across browsers
This list has been so great helping me out as a CSS newbie. I have been ready to pull my hair out many days trying to make things work. We are now closer to actually having a new site, but I'm having a few small problems with the navbar. Can you give me any ideas on how to fix the following problems? * In Firefox I have a strange space on the right side of the first and second level navigation towards the end of the navigation items before the border. * In NE7 it is OK. * In IE6 the space I see in Firefox is absent, but a different space appears BETWEEN my vertical navigation items. Some of the dividing lines between vertical nav items also look like double lines. * I also want to figure out how to move the little arrow slightly to the left on the first level and second level navigation without the background color or the border shrinking to the left with it. http://209.211.255.131/newsite/testfeb17.html http://209.211.255.131/newsite/testfeb17.css Thanks! Dova H. Wilson Marketing Communications Specialist George Washington University Virginia Campus 44983 Knoll Square, Rm. 305 Ashburn, Virginia 20147 Phone: 703-726-3652 Fax: 703-726-3655 www.gwvirginia.gwu.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Site check Moz printing IE position
Greetings all, I would be very thankful if some of you would take a look at http://www.asu.edu/lib/olac and let me know if you see any glaring issues besides the two that I'm asking about below. I don't have access to a Mac, so haven't checked on that platform at all, and I'm nervous about it. The html and css both validate. I've tested on Opera 8.52, FF 1.5, Moz 1.7.12, and IE 6.0, all on WinXP. Printing in Mozilla: When I print the index page in Moz, the second half of the page overlays the top, so you can't read much of it. When I print preview, it crashes the browser on closing the preview. The other pages print and preview just fine. Position in IE 6.0: This one isn't as important, but I'd like to fix it if possible. The navigation div is overlapping the header by about 3-4 pixels. #nav is positioned absolutely in em. Is there a way to get it to scoot down where it's supposed to be? Stylesheets: http://www.asu.edu/lib/olac/olac.css http://www.asu.edu/lib/olac/olac-print.css Any and all advice/suggestions/complaints are appreciated. Thanks, Debbie __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 Float Drop Issues
Pringle, Ron wrote:
...Basically the problem is that the right non-floated
column is dropping below the left-floated container. ...
URL: http://tinyurl.com/mxtve
#container { float: left; width: 100%; margin-left: -33px;}
I think #container needs another
margin-right: -3px;
to work around the 3px jog, and
#sidebar { padding-left: 100%; margin-left: -33px; }
seems to cause a quirk with percentage padding, but I am not sure.
padding-left: 99%;
looks better here. It doesn't convince me, though.
Ingo
--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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 Float Drop Issues [SOLVED]
Pringle, Ron wrote:
...Basically the problem is that the right non-floated
column is dropping below the left-floated container. ...
URL: http://tinyurl.com/mxtve
Ingo replied:
#container { float: left; width: 100%; margin-left: -33px;}
I think #container needs another
margin-right: -3px;
to work around the 3px jog, and
#sidebar { padding-left: 100%; margin-left: -33px; }
seems to cause a quirk with percentage padding, but I am not sure.
padding-left: 99%;
looks better here. It doesn't convince me, though.
Ingo-
I managed to fix it along the same lines of thinking as you've been
pursuing. I eliminated the #sidebar padding and margin completely, and
gave the #container an extra padding of 3px to eliminate that jog in
there that you pointed out. Works well now.
There were a lot of other 3px and double margin issues with the layout
that I'd fixed previous to posting, but I missed that 3px shift on the
container.
Thanks Ingo!
Regards,
Ron
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] IE 5.x extra spacing issue
Hi - I am having difficulty with extra spacing in IE 5.x that does not respond to box-model and double-margin fixes. The page in development is located at: http://www.snider-web.com/GEO_new/index_new.html The CSS is at: http://www.snider-web.com/GEO_new/stylesheets/core.css with additional stylesheets for IE 5 and IE 6 (linked with conditional comments) at: http://www.snider-web.com/GEO_new/stylesheets/IE5.css http://www.snider-web.com/GEO_new/stylesheets/IE6.css The problem appears in the navigation area. The width of some container element is about 20px too wide. The structure is: container div: - menu div (floated left): o navmain div (not floated, containing navigation as unordered list) o navaud div (not floated, containing audience navigation) o contact div (not floated) - content div: o summary div (floated left, containing main text) o sidebar div (floated right) - footer div (clears floated elements) I've colored the background of the navmain ul and navaud ul purple and red to show where it is too wide. I've tried a number of hacks to no avail, and I'm hoping someone can point me to a solution. Thanks! (BTW, the XHTML and CSS validate.) Jeremy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Approaching Designing for Multiple Browsers and Versions
I've done some reading on hacks and conditional comments, and am trying to plan an everyone-friendly site. The process is a bit overwhelming, so I'll start by asking for confirmation of these assumptions (truths). Truth #1 - NN4 can render link, but can't render @import. If I follow a NN4 linked stylesheet by an imported stylesheet other UAs (IE 5+ Mac/WIN, Opera, Firefox, Safari) will override the values in the linked stylesheet with the imported values, so long as every item and class in the NN4 stylesheet is covered in the imported stylesheet. Yes that is true. However, NS4.x is not a CSS browser, it never claimed to be (sadly enough it tries to do so). Therefore I personally tend not to give it a style sheet at all. @import also helps you if you want to not give MSIE 5/Mac (a discontinued browser that is hard to test for) a stylesheet. MSIE 5/ Mac understands @import 'foo.css'; but fails to read @import foo.css; Truth #2 - IE Conditional Comments are completely ignored by non-IE UAs and IE on Mac That is also true. Thierry has come up with a really good approach for supporting as many browsers as possible, this might be exactly what you want to achieve: http://www.tjkdesign.com/articles/branching.asp HTH 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 IE7b2 testing hub -- 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] display family tree without tables
Hi all, I am looking for a way to display a dog pedigree (family tree). Mostly I see that one big image or a table is used for this. I could do it that way although I would rather not if there's a better way. I have been trying to experiment with lists, but I haven't found a workable way with that. Any ideas would be great. Thanks, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Approaching Designing for Multiple Browsers and Versions
Christian Heilmann wrote: Thierry has come up with a really good approach for supporting as many browsers as possible, this might be exactly what you want to achieve: http://www.tjkdesign.com/articles/branching.asp Chris - If it doesn't work for me, I'll proceed with my questions, but at quick glance this looks EXACTLY like what I want to achieve. Cheers! Dagmar __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE 5.x extra spacing issue
Jeremy Snider wrote: Hi - I am having difficulty with extra spacing in IE 5.x that does not respond to box-model and double-margin fixes. The page in development is located at: http://www.snider-web.com/GEO_new/index_new.html The problem appears in the navigation area. The width of some container element is about 20px too wide. Yup, it's actually exactly 20px :-) If you change the width in the four instances of Tan Hack to fix IE 5.x width issue (#navmain li a, #navaud li a, #contact h2, #contact dl) from 174px to 154px, the column will have the right width. I've colored the background of the navmain ul and navaud ul purple and red to show where it is too wide. Note, that even though the width of the column is now correct, you still don't get rid of the space on the left of the uls. That's just IE5 though. I vaguely remember I got rid of it once (though buggy on hover), but I'm not sure, and even if so, I can't remember how. -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 Navigation formatting issues and overall page structure issue
On 2/8/06, K Husbands [EMAIL PROTECTED] wrote:
1. Black line appears under the nav tab, which I don't want. The goal
is for the tabs to sit flush on the div holding the image (i.e. div desc)
when i delete this part, the line disappears:
#nav {
background: url(images/greypx.gif) repeat-x left bottom;
}
2. Space appears between the navigation bar and the image. (not
desired)
looks like you fixed this. :)
3. Even though I made the initial template page and duplicated it for
the other pages, when browsing the site in Firefox the whole page shifts
from left to right and back depending on which links you click. For instance
going from the Media page to Clients or Contact Us page, everything appears
fine, as with going from Home to Services to Values. However, any other
sequence browsing the site, shifts entire page within the browser. I am
completely perplexed as to why this is happening.
i'm not seeing the page shift, so i assume it's been fixed as well.
if not, however, it might be due to the scrollbar on the right hand
side appearing for tall pages.
The site can be viewed here:
http://www.wordseurope.domainsolutions.ca/test/index.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Approaching Designing for Multiple Browsers and Versions
Christian Heilmann wrote: @import also helps you if you want to not give MSIE 5/Mac (a discontinued browser that is hard to test for) a stylesheet. MSIE 5/ Mac understands @import 'foo.css'; but fails to read @import foo.css; I know Christian is aware of this, but just for purposes of the archive, he wrote this exactly backwards. IE/Mac FAILS to read URLs enclosed by SINGLE quotes. It DOES read URLs enclosed with double-quotes or no quotes at all. HTH, -Adam Kuehn __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Clearing internal floats
Oh well, thanks anyway! :-) --- Els [EMAIL PROTECTED] wrote: Well, overflow:auto doesn't have effect in IE, and yes, it does give a 'block effect', a clear property has a problem with the sidebar, unless the parent (#page) is floated, but #page can't be floated if you want the content to extend below the sidebar. Frankly, I don't think there's any option to do what you want, unless you would do it on a per post basis. If there's an image in a post, set the min-height on that post to the height of that image (or higher, if the image doesn't start at the top of the post). Won't work in IE, so you'd have to give IE just a height, and accept that that post won't flow below the sidebar. -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] display:inline List Items and whitespace bug
Hi All, I've tried searching for a solution to this with no luck. Has anyone discussed whitespace bugs in lists, where the list-items are set to display-inline? Here's the test page: http://clioweb.org/test/listtest.html The CSS is in the header. All three of these unordered lists have list items that are set to display:inline;. I'm getting spacing around the list-items in the first example on this page. The whitespace is occurring on Firefox 1.5, Safari, Opera 8.51, and IE5+, on Mac and Windows. In the second example, I use the same CSS, but I eliminate all the whitespace around each list-item in the code. The result is no space in the displayed list. Is there a cross-browser way to fix this in CSS, without resorting to changing the code, as I do in the second example on the page? Thanks in advance! Jeremy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] DOCTYPEs
Is there a distinction between LOOSE and QUIRKS? I have been operating under the assumption that they are functionally equivalent in IE. -- Marc Luzietti Flagship Project Bayview Financial, L.P. (305) 341-5624 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Approaching Designing for Multiple Browsers and Versions
@import also helps you if you want to not give MSIE 5/Mac (a discontinued browser that is hard to test for) a stylesheet. MSIE 5/ Mac understands @import 'foo.css'; but fails to read @import foo.css; I know Christian is aware of this, but just for purposes of the archive, he wrote this exactly backwards. IE/Mac FAILS to read URLs enclosed by SINGLE quotes. It DOES read URLs enclosed with double-quotes or no quotes at all. Yes, sorry about that. Didn't have a coffee yet. -- 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 IE7b2 testing hub -- 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] Div overlap of floated image
Vic Rauch wrote:
http://vicrauch.com/Untitled-2.htm
Photo that is floated right on this page is being overlaid by a div on the
left, but I can't figure out how to stop it. Of course it works OK in
FireFox.
Add...
#photoright {position: relative;}
...and IE/win will layer correctly.
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] display:inline List Items and whitespace bug
Jeremy Boggs wrote: I've tried searching for a solution to this with no luck. Has anyone discussed whitespace bugs in lists, where the list-items are set to display-inline? Here's the test page: http://clioweb.org/test/listtest.html The CSS is in the header. All three of these unordered lists have list items that are set to display:inline;. I'm getting spacing around the list-items in the first example on this page. Actually, this is correct behavior for inline elements. This is so that, for example, you can use a construction like this: These little things can be emreally/em strongVERY/strong frustrating if you don't know the reasons why they happen. Note that you really don't need or want to emphasize or strongly emphasize the space between the elements. Instead, it is treated as a normal, anonymous text node. That node really only becomes a problem when you convert what is normally a block element into one that is inline, and thus aren't expecting the result. Is there a cross-browser way to fix this in CSS, without resorting to changing the code, as I do in the second example on the page? I am aware of no reliable way to neutralize this behavior in CSS. Sorry, -Adam Kuehn __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
I searched all over for information on this bug but didn't see
anything. I just entered in Bugzilla just in case.
I thought I was being clever by using the first-letter pseudo selector
to style my required field asterisk without any extra code but firefox
rained on my parade.
OK, so an asterisk is not a letter, technically, but ff is not even
consistent in that regard.
html
head
style
p:first-letter{
color:red;
}
/style
/head
body
ptest/p
p*test/p
p***test/p
pnbsp;test/p
/body
/html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
On Tuesday 2006-02-21 16:45 -0600, Vinson Gracia (777) wrote: I searched all over for information on this bug but didn't see anything. I just entered in Bugzilla just in case. I thought I was being clever by using the first-letter pseudo selector to style my required field asterisk without any extra code but firefox rained on my parade. OK, so an asterisk is not a letter, technically, but ff is not even consistent in that regard. http://www.w3.org/TR/CSS21/selector.html#first-letter says: # Punctuation (i.e, characters defined in Unicode [UNICODE] in the # open (Ps), close (Pe), initial (Pi). final (Pf) and other # (Po) punctuation classes), that precedes or follows the first letter # should be included The asterisk is in the Po character class, so it should be included. This means that in the examples you give, the first letter should be: ptest/p t p*test/p *t p***test/p ***t pnbsp;test/p unknown. The spec isn't clear on this one. -David -- L. David BaronURL: http://dbaron.org/ Technical Lead, Layout CSS, Mozilla Corporation pgpvs08sAqYfB.pgp Description: PGP signature __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] display family tree without tables
On Feb 21, 2006, at 3:03 PM, Brian Funk wrote: I am looking for a way to display a dog pedigree (family tree). Mostly I see that one big image or a table is used for this. I could do it that way although I would rather not if there's a better way. I have been trying to experiment with lists, but I haven't found a workable way with that. Any ideas would be great. How about this: http://www.malinut.com/alix-pedigree.php Nary a table in sight, and I believe it degrades relatively gracefully (list). Margaret [EMAIL PROTECTED] Design for a Better World www.hitthenail.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 List Menu Options
Keith, On Feb 20, 2006, at 9:24 PM, Keith Kaiser wrote: I want to be able to have just one front page and use XMLHttpRequest() to replace the tan part of the page depending on the menu selection. This isn't a css question, so the remainder of my reply will be off-list. -- Roger Roelofs Remember, if you’re headed in the wrong direction, God allows U-turns! ~Allison Gappa Bottke __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
Totally rains on my parade... but thanks for the W3C Spec! I think the W3C is wrong on this one though. I'd say at least 10^2^2 terabytes of code is being used to style the asterisks for required fields on forms around the world. I think changing this would vastly improve bandwith on the internet as a whole. :P Thanks again! On 2/21/06, L. David Baron [EMAIL PROTECTED] wrote: On Tuesday 2006-02-21 16:45 -0600, Vinson Gracia (777) wrote: I searched all over for information on this bug but didn't see anything. I just entered in Bugzilla just in case. I thought I was being clever by using the first-letter pseudo selector to style my required field asterisk without any extra code but firefox rained on my parade. OK, so an asterisk is not a letter, technically, but ff is not even consistent in that regard. http://www.w3.org/TR/CSS21/selector.html#first-letter says: # Punctuation (i.e, characters defined in Unicode [UNICODE] in the # open (Ps), close (Pe), initial (Pi). final (Pf) and other # (Po) punctuation classes), that precedes or follows the first letter # should be included The asterisk is in the Po character class, so it should be included. This means that in the examples you give, the first letter should be: ptest/p t p*test/p *t p***test/p ***t pnbsp;test/p unknown. The spec isn't clear on this one. -David -- L. David BaronURL: http://dbaron.org/ Technical Lead, Layout CSS, Mozilla Corporation __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] css link targets [was][Fwd: Re: (no subject)]
I'd like to add to the msg below (which was eaten by a 'no subject' filter first time round) that attribute values only _must_ be quoted with certain DOCTYPES. additionally the values can be quoted with single quotes, I'm 80% sure. I do know that using double quotes on attribute values in practice never causes a problem (I'm sure I read up on it years ago, can't remember the specifics :-S). additionally ALWAYS (depending on your situation this could be taken on per client/system/project basis) using either single OR double (not mixed!) for html attributes (the same goes for javascript or css, with regard to quotes) has a benefit when you spend lots of time writing things that generate [dynamic] html/js/css - the benefit being less 'mis-quote' bugs. rgds, Jochem Original Message Subject: Re: [css-d] (no subject) Date: Sat, 18 Feb 2006 13:15:21 +0100 From: Jochem Maas [EMAIL PROTECTED] To: Maxwell Balmain [EMAIL PROTECTED] CC: css-d@lists.css-discuss.org References: [EMAIL PROTECTED] Maxwell Balmain wrote: Hi All, Quick question: I am converting some pages to to xhtml strict CSS. What is the correct way to get links to open in a fresh page? I guess the target= _blank function will not validate. 'target' is an attribute of an anchor tag; you can still use it though all attribute values should be quoted i.e.: a href=#test target=_blankclick/a not strictly anything to do with CSS (I trying to think if it's possible to define that certain [classes of] link should open in a new window using CSS - but I can't) Thanks, Max Maxwell Balmain [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
On Tuesday 2006-02-21 17:33 -0600, Vinson Gracia (777) wrote:
Totally rains on my parade... but thanks for the W3C Spec!
I think the W3C is wrong on this one though. I'd say at least 10^2^2
terabytes of code is being used to style the asterisks for required
fields on forms around the world. I think changing this would vastly
improve bandwith on the internet as a whole. :P
That's not what :first-letter is for. It sounds like what you really
want is more like:
input:required::before { content: *; color: red; }
See http://www.w3.org/TR/css3-ui/#pseudo-required-value for :required
and CSS2.1 / css3-selectors for the rest.
-David
--
L. David BaronURL: http://dbaron.org/
Technical Lead, Layout CSS, Mozilla Corporation
pgpIHGmH74f4N.pgp
Description: PGP signature
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] ASP.net, xhtml, CSS based CMS?
Hey guys and gals, I have been looking all day for a CSS/Xhtml stylable blog style CMS for our ASP.Net site. Seems to be plenty PHP based ones, but no ASP.NET. I fould one fairly good one but it has tons of tables and seemingly bloated code. Anyone know of any? Doesnt have to be a free solution. Thanks Adam __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] IE 5.x extra spacing issue
Jeremy Snider wrote: [list in IE5] Thanks - I'd put in the Tan Hack to get those elements to display the correct width (174px), but I guess I created more problems. Now to figure out where that space on the left comes from! I think I found it. Forget what I said about the 174px needing to be 154px. The 20px is coming from the relationship between the width on the ul and the width on the li. As soon as you set a width on a ul, a space appears to the left of the li elements. If you just hide the width of the ul from IE5, the lists behave nicely. The dl in #contact doesn't need the Tan hack, without the hacks on #contact h2 and #contact dl, that part neatly stays within the column by itself. -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Form Layout how would *you* do this? question...
From: Les Mizzell [EMAIL PROTECTED] What I'm trying to get is: http://www.columbiacityjazz.com/LEV4_VOUCHERS_DIV_STEP2.gif The left/right aligned columns isn't the problem. It's the darned dotted line between them. This same configuration takes place in dozens of places - Class ROW is 600 pixels wide. The width of the left/right content could be split 200px/400px or 450px/150px - could be anything and content could be anything on either side...multiple text boxes, just text Here is a page with links to several examples that people put together several years ago. Perhaps you will find the appropriate inspiration on one of these pages. http://css-discuss.incutio.com/?page=DotLeaders I hope that helps, ~holly __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Div Height
I recently updated my website, replacing a table with a div as the body of
the page. I want this division to be at least the height of the screen but
also grow if content scrolls off the page. In IE, the page renders fine,
but in FireFox, the division does not grow if the text scrolls beyond the
bottom of the screen.
An example page is http://www.swimoregon.org/AquaMaster/
The division's id is body and below is the relevant css
body {
height:100%;
padding:0;
margin:0px;
text-align:center;
background-color: #336EA8;
}
#body {
width: 649px;
min-height: 100%;
height: 100%;
border-left:4px solid #00;
border-right:4px solid #00;
padding-left:2px;
padding-right:2px;
background-color:#ff;
margin-left:auto;
margin-right:auto;
}
I'm constantly fighting with this set up and actually used a table on
another website to avoid this problem. I would really like to figure out
how to do this with a division as I understand that tables are deprecated in
the use of layout.
Thank you,
Robbert van Andel
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Div Height
Robbert van Andel wrote:
I recently updated my website, replacing a table with a div as the
body of the page. I want this division to be at least the height of
the screen but also grow if content scrolls off the page. In IE, the
page renders fine, but in FireFox, the division does not grow if the
text scrolls beyond the bottom of the screen.
http://www.swimoregon.org/AquaMaster/
I'm constantly fighting with this set up and actually used a table on
another website to avoid this problem. I would really like to
figure out how to do this with a division as I understand that tables
are deprecated in the use of layout.
The solution is to make divs behave/render like tables, by adding...
#body {display: table;}
...so they do expand with content as tables does. That's according to
CSS specs, so Firefox will do just fine with it.
IE/win doesn't understand 'display: table;' but IE6 and older versions
are saved by a bug called 'Layout'[1]. Don't know how IE7 will do
though, as it won't be up to standards and they have partially killed
that 'Layout' bug.
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
IE7b2 testing hub -- 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] NS6.2 and :hover
Hi All, I'm playing with a navigation using li:hover to show background images to the li's plus setting display: block to ul (and li's) nested within it. Sample: ul li a href=#/a ul liItem1/li /ul /li /ul The problem is that in NS6.2, hovering thru the main li the background changes as expected, but when the cursor is over the a tags it loses the :hover of the list. Is it expected in NS6.2 or is there a work around? Thanks -- --- -- --- -- --- -- --- -- Kevin Navia Web Developer __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Div Height
That was it.
Thank you,
Robbert
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Gunlaug Sørtun
Sent: Tuesday, February 21, 2006 6:23 PM
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] Div Height
Robbert van Andel wrote:
I recently updated my website, replacing a table with a div as the
body of the page. I want this division to be at least the height of
the screen but also grow if content scrolls off the page. In IE, the
page renders fine, but in FireFox, the division does not grow if the
text scrolls beyond the bottom of the screen.
http://www.swimoregon.org/AquaMaster/
I'm constantly fighting with this set up and actually used a table on
another website to avoid this problem. I would really like to
figure out how to do this with a division as I understand that tables
are deprecated in the use of layout.
The solution is to make divs behave/render like tables, by adding...
#body {display: table;}
...so they do expand with content as tables does. That's according to
CSS specs, so Firefox will do just fine with it.
IE/win doesn't understand 'display: table;' but IE6 and older versions
are saved by a bug called 'Layout'[1]. Don't know how IE7 will do
though, as it won't be up to standards and they have partially killed
that 'Layout' bug.
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
IE7b2 testing hub -- 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-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
Vinson Gracia wrote: I thought I was being clever by using the first-letter pseudo selector to style my required field asterisk without any extra code but firefox rained on my parade. On which version of Firefox does this not work? I have an example of using :first-letter to color a heart entity - admittedly generated content, but applied *after* generating (for the sake of other browsers). Here's the example, still working on FF 1.0.5.1 - http://localhost/sandbox/hearts.html Do you have a URL we could look at? Cordially, David -- David Hucklesby, on 2/21/2006 http://www.hucklesby.com/ -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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 Moz printing IE position
Debbie Flitner wrote: I would be very thankful if some of you would take a look at http://www.asu.edu/lib/olac and let me know if you see any glaring issues besides the two that I'm asking about below. Stylesheets: http://www.asu.edu/lib/olac/olac.css http://www.asu.edu/lib/olac/olac-print.css Any and all advice/suggestions/complaints are appreciated. Thanks, Debbie No big deal, but you are getting lateral page shift @ 1280. This articlehttp://www.hicksdesign.co.uk/journal/forcing-scrollbars-now-even-better on forcing scrollbars /may/ help: Nice color selection for Arizona, BTW. And content text that is readable without zoom at 1280 is so different-- what a delight! Regards, ~davidLaakso -- http://www.dlaakso.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Opera problem
Hello, I am testing with FireFox, IE6 and Opera on my local host. My page displays almost correctly in FF and IE6, but fails to display a CSS menu in Opera. When I upload the files to the server, all of the browsers display the page about the same, ie, the menu displays. I am using ASP.NET and have includes for the CSS and INC files and for the html for the menu. The include for the INC and HTML are not expanded on the local host, but expand just fine on the server. This is holding up my development since I need to FTP to the server to see any corrections and turn around is extremely slow because of timeouts. Thanks Dennis __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Can I put a link on an image in CSS?
On 18-02-06 Peter Snow Cao wrote: I want to put a link to my homepage on the logo image that is in the upper left-hand corner of every page put there by the CSS file [...] http://bikechina.com/ What is the best way to do this? Is there a way I can do it in CSS or do I have to use HTML to code each page? Lots of replies ... In the meantime I was experimenting somewhat. I found it can be done in CSS only, without losing text-readers, screen-readers, or missing the link when css and or images are turned off. No image-mapping or transparent.gif is needed. This is the testpage http://home.tiscali.nl/developerscorner/css-discuss/test-bikechina.htm logo in css (see source code), with screenshots of all options I see. I found it can be done also with the (css-styled) logo as foreground image in the html. Also without losing the rest. This is the second testpage http://home.tiscali.nl/developerscorner/css-discuss/test-bikechina-htm.htm: logo in html. While the logo is important to show for the identity of the site and company, I agree with the 2 reasons to use the 2nd way, as David Dorward wrote: 1. CSS might be turned off or unavailable. - Then a background-img is invisible. In the html-way the logo is displayed as long as images are supported. 2. The user might want to print the page (and background image printing is disabled by default). - The logo in the html will always be printed together with the banner. Note: to serve the text/screen-readers, I've put a text-link as layer under the images. It has an h3 tag to get better noticed by search engines. This text-link is also visible when in a screen-browser the images are turned off. Then a small trick is hidden: Although the text-link cannot be clicked itself when images are turned off and the css is still on (link covered up by the img-layers), I made a pseudo-click. By dividing the the words Bike China and Adventures in two lines, they are just under the clickable area of the logo. Then even if the logo itself is not visible, this area can be clicked (also the tooltip is appearing when hovering). To see the area: Firefox WebDeveloper extension Images outline images background images. Endless, css! :-) Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] Interesting Firefox bug? (first-letter pseudo selector)
I was checking on ff 1.5.
Here's the code to test:
htmlhead
style
p:first-letter{
color:red;
}
/style
/head
body
ptest/p
p*test/p
p***test/p
pnbsp;test/p
/body
/html
The best solution is to use the :before pseudo selector as Mr Baron
pointed out but my corp is an IE only shop. :(
On 2/21/06, David Hucklesby [EMAIL PROTECTED] wrote:
Vinson Gracia wrote:
I thought I was being clever by using the first-letter pseudo selector
to style my required field asterisk without any extra code but firefox
rained on my parade.
On which version of Firefox does this not work? I have an example of
using :first-letter to color a heart entity - admittedly generated
content, but applied *after* generating (for the sake of other browsers).
Here's the example, still working on FF 1.0.5.1 -
http://localhost/sandbox/hearts.html
Do you have a URL we could look at?
Cordially,
David
--
David Hucklesby, on 2/21/2006
http://www.hucklesby.com/
--
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
