Re: [css-d] help with 4 column css
Carol Flax wrote: I'm trying to write a 4-column page and content in center columns is sliding under side columns. also - banner is sliding around when page is resized. help, please. I'm new to CSS and struggling. thanks! http://www2.whidbey.com/cflax/nwbaby_test/index.html Hi Carol, I had a little trouble with some of the HTML on your page. I've cleaned it up some to better isolate the problem. Is this what you're going for: http://www.theholiergrail.com/tests/fourcolumns_nwbc.php Let me know and I'll send the code along for you. Obviously, this style configuration does not provide full-length column backgrounds. There are some ways to achieve this if you need (images, additional tags and some non-cross browser solutions). Give me an idea where you're heading with the design and I'll help if I can. Best Regards, Bill Brown TheHolierGrail.com MacNimble.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Vertical menu
Hi I'm sorry for my english writing. I'm developing a site on a local computer. And found the menu i wanted here: sperling.com/examples/menuv/ But i can't get it to work in IE6 properly. The first menupoint is working ok, but the submenus are gone to cyperspace. In Opera 9 and Firefox 2, it works perfect. Not tested with Safari and other browsers yet. Having any solutions second ? : At the moment the menu is popping out from left to right. Is it possibly to make it pop out from right to left ? third ? : Is it possibly to make the menu stay in the same column. So the submenus is covering the main menu. Hope you understand my questions. -- Regards / Mhv. Ib K. jensen __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] negative absolute positioning bad for SEO?
Brian Campbell wrote: i've been using negative absolute positioning on text that i want hidden, but need to be accessible to alternate devices. someone has suggested that the text won't be seen by bots (like google) so it won't be processed and can't be utilized for SEO purposes. in your experience is this true? The truth is that the answer may be one today, another tomorrow and yet another next week, and so on. Web site creators and bot creators constantly try to outsmart each other and constantly end up outsmarting both themselves and each others by creating solutions at both ends based mainly on pure guesswork. It's a no win, all lose situation, that probably won't improve in the near future - if ever. All text in the markup will be seen by bots, non-CSS capable and CSS capable browsers alike. _Where_ and _how_ you position it with CSS, doesn't matter. You can hide stuff from users of CSS capable browsers in more ways than I care to list, and most web pages released on the web contain some hiding since they wouldn't work otherwise. What bots and non-CSS capable browsers do with _any_ text in the markup is another matter entirely, but they can't differentiate unless they analyzes both markup and CSS (and maybe some scripts too), which non-CSS capable browsers can't and bots are unlikely to be very good at - if at all. Analyzing human intentions is not something any software is any good at, and I don't think those behind various bots are any better at creating artificial intelligence that really works in this respect. They will inevitably get it wrong at least as often as they get it right, which reduces the usefulness of AI to zero in this respect. This reduces the chance of anything getting lost for _any_ purpose, to what humans can judge if/when they look at and analyzes your document. It also heightens the chance that humans judge it wrong and discard / punish perfectly ok solutions since humans are not very good at judging other people's intentions either, which reduces the usefulness of HI to near zero too - in this respect. Conclusion: make sure you do not intentionally create / include / hide something for the wrong purpose, and hope that others never accuse you of cheating. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Vertical menu
Your English writing is fine. :-)
I can't understand why you can't get the menu to work in IE6. It works fine for
me. Perhaps you have a modified code that needs to be inspected? Can you upload
it somewhere and send me the URL?
Yes, you can make the sub-menus pop out from right to left by changing: #menuv
li ul {left: - to -8em as below. This is not without problems, as you would
then need to reverse the direction of the 'arrow pointer' gif and alter the
code to place it on the opposite side.
#menuv li ul
{
position: absolute;
top: 0;
left: -8em;/* distance from parent menu */
display: none;
}
To make the sub-menu cover the parent menu, just change the 'left:' (in the
code above) to 0. However, it's not nice and makes the menu hard to navigate,
so you may not want to do it. :-)
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
- Original Message -
From: Ib Jensen
To: css-d@lists.css-discuss.org
Sent: Thursday, May 15, 2008 9:21 AM
Subject: [css-d] Vertical menu
I'm sorry for my english writing.
I'm developing a site on a local computer.
And found the menu i wanted here:
sperling.com/examples/menuv/
But i can't get it to work in IE6 properly. The first menupoint is working
ok, but the submenus are gone to cyperspace.
In Opera 9 and Firefox 2, it works perfect. Not tested with Safari and other
browsers yet.
Having any solutions
second ? :
At the moment the menu is popping out from left to right.
Is it possibly to make it pop out from right to left ?
third ? :
Is it possibly to make the menu stay in the same column.
So the submenus is covering the main menu
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with 4 column css
Carol Flax wrote: I'm trying to write a 4-column page and content in center columns is sliding under side columns. also - banner is sliding around when page is resized. help, please. I'm new to CSS and struggling. thanks! http://www2.whidbey.com/cflax/nwbaby_test/index.html Carol, The difficulty you are having may be primarily due to using absolute positioning (brittle) of the two center columns; and having fixed width elements (images) inside percent width columns. Setting overflow:hidden on both of the outer wrappers will open them to enclose the content. And changing the absolute positioning to float:left; may help. However, even at that, users who drag to a /narrower window than 990px/ or so will experience horizontal content crossover and float drop. Setting min-width of 990px and max-width of 100% could help prevent this (with javascript or IE expressions [1] for IE/6 which does not support min/max width). For someone new to CSS, all of this can be somewhat daunting. My /personal opinion/ is to keep it simple. Four fixed pixel width columns that all float left enclosed in a fixed width 960 up to around 980px wrapper will clear the scroll bar for those users at 1024, and provide a reasonable and readable text width measure for those users at 1280 and much, much higher screen resolutions. And it will make life much easier coping with the fixed width images, not to mention making it all happen in IE/6 and IE/7. If you prefer the primary content to be first in the document source order, try setting it up here [2] (I'd avoid the equal height columns for now). [1] http://www.gunlaug.no/contents/wd_additions_14.html [2] http://www.fu2k.org/alex/css/onetruelayout/example/interactive -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with 4 column css
[EMAIL PROTECTED] wrote: Hi Bill, Since css-discuss is a teaching list... and I'm a newbie too... could you send me the css that corrected the problem below? Thanks a bunch!! Susan Sure thing! In this case, the source was ultimately the real problem, not so much the CSS. Deprecated tags and non-semantic element usage created a difficult-to-style tag soup of sorts. A four column layout can grow quite complex rather quickly so having a well thought-out plan of attack in your source development can benefit the styling immensely. I cleaned it up some and moved it into my ever-more-pompous-sounding holier grail framework, the results of which can be found here: http://www.theholiergrail.com/tests/nwbc/index.php I haven't heard back from her yet, but it seems fine on my systems. Anyway, I'll keep you posted. --Bill __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Vertical menu
At 10:21 AM +0200 5/15/08, Ib Jensen wrote: Hi I'm sorry for my english writing. I'm developing a site on a local computer. And found the menu i wanted here: sperling.com/examples/menuv/ But i can't get it to work in IE6 properly. The first menupoint is working ok, but the submenus are gone to cyperspace. In Opera 9 and Firefox 2, it works perfect. Not tested with Safari and other browsers yet. Having any solutions second ? : At the moment the menu is popping out from left to right. Is it possibly to make it pop out from right to left ? third ? : Is it possibly to make the menu stay in the same column. So the submenus is covering the main menu. Hope you understand my questions. Your English is fine. The best advice I can give you is to take what I have on my site as-is and get it to work on your site. Once you do that, then make a copy and alter the copy in baby-steps to get it to look the way you want. It's a process of copy, alter and test. If any step doesn't work, then you can fall back on the previous step and try again. The most common mistake people make is not keeping the paths to the css and csshover files the same. You can move anything you want anywhere you want, but you have to let the code know where you put these files. If you have any other problems, please review the instructions I provided at: http://sperling.com/examples/menuh/ and http://sperling.com/examples/menuv Cheers, tedd -- --- http://sperling.com http://ancientstones.com http://earthstones.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] negative absolute positioning bad for SEO?
At 2:00 PM +1000 5/15/08, Blake wrote: On Thu, May 15, 2008 at 6:51 AM, Brian Campbell [EMAIL PROTECTED] wrote: i've been using negative absolute positioning on text that i want hidden, but need to be accessible to alternate devices. someone has suggested that the text won't be seen by bots (like google) so it won't be processed and can't be utilized for SEO purposes. in your experience is this true? Google won't punish you for using image replacement techniques or hiding something that you only need to display for alternate devices. It can tell the difference between that and spamming keywords or links and then hiding them. As far as I know, Bob Easton was credited with the off-left technique -- here's what happened to him: http://www.access-matters.com/2008/04/19/off-left-banned-by-google/ It's something to consider. Cheers, tedd -- --- http://sperling.com http://ancientstones.com http://earthstones.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] negative absolute positioning bad for SEO?
At 2:00 PM +1000 5/15/08, Blake wrote: On Thu, May 15, 2008 at 6:51 AM, Brian Campbell [EMAIL PROTECTED] wrote: i've been using negative absolute positioning on text that i want hidden, but need to be accessible to alternate devices. someone has suggested that the text won't be seen by bots (like google) so it won't be processed and can't be utilized for SEO purposes. in your experience is this true? Google won't punish you for using image replacement techniques or hiding something that you only need to display for alternate devices. It can tell the difference between that and spamming keywords or links and then hiding them. As far as I know, Bob Easton was credited with the off-left technique -- here's what happened to him: http://www.access-matters.com/2008/04/19/off-left-banned-by-google/ It's something to consider. Cheers, tedd Also keep in mind however these last two lines from Bob's article: Yes, Google was right. Spam was stuffed into hidden text on my site. They were not complaining about my accessibility technique. If you read that article, it's clear his site was hacked and manipulated. Any replacement technique would have fallen victim to this (hidden, offset, covered with an image). Thus the real lesson in Bob's article is more about vigilance than about shunning a specific technique. Just my two cents. Bill Brown TheHolierGrail.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [ADMIN] Re: negative absolute positioning bad for SEO?
As far as I know, Bob Easton was credited with the off-left technique -- here's what happened to him: http://www.access-matters.com/2008/04/19/off-left-banned-by-google/ It's something to consider. What? Not letting your site get hacked? Tedd, I think you've missed the punchline of Bob's post and would speculate that you were mislead by the url his cms created which dispenses the question mark in Bob's actual title for the post. The upshot is we don't really know how, why and when Google (and other search engine providers) discriminate against any particular form of hiding text with CSS. [0] What we do know for sure though is that this issue has very little to do with this list's stated purpose. Thread closed please people. Alex css-d moderator [0] Hiding offscreen is probably fairly safe since so many accessibility types have advocated it and so many sites actually do use it legitimately. Even if Google did ban its use outright, spammers could just as trivially place the stuff they want to hide beneath another element with a higher z-order that would obscure what was beneath it. Maybe they already do. Short of Google essentially rendering each and every page and developing an articially intelligent agent that would compare what was hidden and what was shown [1], this is an area that will, for the foreseeable future, require human judgement and intervention - which is not to say Google might not disagree with what you over what is legitimate hiding or not. The tags and css you use are going to come way down the list of things in the big picture when compared to the actual content. If you still feel you need to worry about such things, please take it to a more general web dev discussion list, or even better, one dedicated to SEO. [1] Beyond checking that the color of text is not set to the same as the background... __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Which is the best solution min-width and max-width in ie6 ?
Dal wrote: Hello, I have never used min-max---width-height properties before, but I need to use it now. I have found many solutions on web for ie6 and I am confused now. Which is the best solution to impliment these properties in ie6 ? Thanks. Dal I've always resorted to used css expressions for this. Entirely non-standard of course and hacky to the max but they are functioning solutions for otherwise impossible to implement property http://webfx.eae.net/dhtml/cssexpr/cssexpr.html -Mark __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] site check -- IE6 problems
Hi all, The following site is working fine in IE7 and Firefox 2, but breaks down in IE6. Specifically the page sections containing the navigation bar and the content, are not filling down the page and stopping at the footer, along with scroll bars not appearing per the overflow: auto property on a containing content div. Can anyone shed light as to what I'm doing, or not doing, that is causing this to breakdown!? Thanks, Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check -- IE6 problems
Okay... it's definitely one of those days... here is the URL that was missing from my previous missive... www.areteam.com ...Rob -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Rob Emenecker Sent: Thursday, May 15, 2008 10:18 AM To: css-d@lists.css-discuss.org Subject: [css-d] site check -- IE6 problems Hi all, The following site is working fine in IE7 and Firefox 2, but breaks down in IE6. Specifically the page sections containing the navigation bar and the content, are not filling down the page and stopping at the footer, along with scroll bars not appearing per the overflow: auto property on a containing content div. Can anyone shed light as to what I'm doing, or not doing, that is causing this to breakdown!? Thanks, Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check -- IE6 problems
Hi Rob,
You're using a lot of absolute positioning, which can be tricky. It
looks like you're trying to tile an image on #page-bg-body a la faux
columns. But check out what happens when you add a border to it:
style
#page-bg-body {border:1px solid red;}
/style
In IE, it has no height because it has no children still in document
flow. Since it has no height, it won't tile down the length of the page
as you expected.
I would try to simplify your CSS a bit by losing the absolute
positioning and using floats instead. The design you have should require
simple enough CSS. I would tile your image down on the body element.
Center the #page-bg-body element on the page and then float #body-navbar
left and #body-contents right.
Since you want the content to extend down the length of the page, try
applying a height of 100% to #page-bg-body and position it so that it
runs the length of the page, top to bottom. Then apply enough padding to
the top and bottom to accommodate the masthead and footer areas,
respectively. Position the masthead and footer areas absolutely, and you
should have a design that will be more resilient.
You could always use a template that has already been developed and
adapt it to your own use, I think the following is pretty much what you
need:
http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/
Apply Cederholm's Faux Column technique, adjust the height of the main
content and nav panes to extend to the bottom and you should be good.
Hope that helps,
Chris
http://www.nextdesigns.ca
Rob Emenecker wrote:
Okay... it's definitely one of those days... here is the URL that was
missing from my previous missive...
www.areteam.com
...Rob
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Rob
Emenecker
Sent: Thursday, May 15, 2008 10:18 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] site check -- IE6 problems
Hi all,
The following site is working fine in IE7 and Firefox 2, but
breaks down in IE6. Specifically the page sections containing
the navigation bar and the content, are not filling down the
page and stopping at the footer, along with scroll bars not
appearing per the overflow: auto property on a containing
content div. Can anyone shed light as to what I'm doing, or
not doing, that is causing this to breakdown!?
Thanks,
Rob
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Menu Positioning Question
Hi, We have a design which has two sets of menus and we would like to give every designer control on laying out the menus using their own CSS. The HTML that we are looking at is extremely simple. --- div id=Menu2 ul lia href=#Home/a/li lia href=#Contact us/a/li li class=lasta href=#Sitemap/a/li /ul /div div id=Menu2 ul li class=titleLanguages:/li lia href=# class=SelectedEnglish/a/li lia href=#Dutch/a/li lia href=#French/a/li lia href=#Italian/a/li li class=lasta href=#Spanish/a/li /ul /div While this html gives us the flexibility to place and display the individual menus independent of each other, it does not cater for the usecase where we have to place both of these menus horizontally aligned with the same background shades. Is this doable with this html or do we need to change the html? Regards, Sohail __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Partially Visible Text In IE7
I have a dynamic page which is being generated. I've avoided using tables for non-tabular content (except for a couple of ASP.NET controls I can't change). However, for some reason the text for the movie title on the very last one doesn't always render correctly in IE7. I can't find any explanation for when it works and when it doesn't. I've tested Firefox and Safari and they render fine. Can anybody help? http://ppointe.pfestore.com/capacity/titles/ComingSoon.aspx Sometimes the Now Showing page does it as well. Anyway, this page should stay the same for the rest of the day, starting on Friday it might not be messing up anymore. Thanks. Brant Burnett Pathfinder Software www.pfasoft.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] top border for list items not showing in ie
Hi -
On this page -- http://www.rochesterhistory.org/about/ -- all the left
hand navigational elements have a horizontal line between them. This is
done by adding a border-top property.
#sidebar ul li a {style.css (line 128)
border-top:0.05px solid #EFAA7D;
color:#FF;
display:block;
margin:0px 0px 5px;
padding:10px 10px 7px 12px;
text-decoration:none;
}
This shows in FF, but not in IE. What am I missing? The full css is at
http://www.rochesterhistory.org/wp-content/themes/twister-10/style.css
Thank you for the assistance.
Barb
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Style Naming Convention
Hi, We need to design an HTML page which provides flexibility for UI designers to add skin this HTM using their CSS design. The question is about naming convention for the text styles. One way is use names like: contentHeading contentDescription contentLabel contentBody ... The designers would then use CSS to define these styles. The other way of doing this is using the standard text style names such as: H1 H2 H3 ... And use the content regions identified by div tags to override the styles for each region. Which is a better practice and are these mutually exclusive? Regards, Sohail __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Partially Visible Text In IE7
Hi Brant,
Hope this helps:
.capacitylisttitle
{
font-size: 2em;
margin-bottom: 0.5em;
display:inline-block;
}
You may want to look into paring down the number of classes you have.
Check out the section on classitis and divitis, it will help you
simplify your code:
http://developer.apple.com/internet/webcontent/bestwebdev.html
Hope that helps,
Chris
http://www.nextdesigns.ca
Brant Burnett wrote:
I have a dynamic page which is being generated. I've avoided using tables
for non-tabular content (except for a couple of ASP.NET controls I can't
change). However, for some reason the text for the movie title on the very
last one doesn't always render correctly in IE7. I can't find any
explanation for when it works and when it doesn't. I've tested Firefox and
Safari and they render fine. Can anybody help?
http://ppointe.pfestore.com/capacity/titles/ComingSoon.aspx
Sometimes the Now Showing page does it as well. Anyway, this page should
stay the same for the rest of the day, starting on Friday it might not be
messing up anymore. Thanks.
Brant Burnett
Pathfinder Software
www.pfasoft.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Partially Visible Text In IE7
Seems like something related to the Peekaboo bug. If the display of the last link is cut and you give it the focus, the link is repainted again and then complete. If you then hover one of the links in the left menu, the last link gets cut again. Maybe the technique desribed here helps: http://www.positioniseverything.net/explorer/peekaboo.html Best regards, Christian Kirchhoff *Directmedia Publishing GmbH* · Möckernstraße 68 · 10965 Berlin www.digitale-bibliothek.de AG Berlin-Charlottenburg · HR B 58002 · USt.Id. DE173211737 Geschäftsführer: Ralf Szymanski · Erwin Jurschitza Brant Burnett schrieb: I have a dynamic page which is being generated. I've avoided using tables for non-tabular content (except for a couple of ASP.NET controls I can't change). However, for some reason the text for the movie title on the very last one doesn't always render correctly in IE7. I can't find any explanation for when it works and when it doesn't. I've tested Firefox and Safari and they render fine. Can anybody help? http://ppointe.pfestore.com/capacity/titles/ComingSoon.aspx Sometimes the Now Showing page does it as well. Anyway, this page should stay the same for the rest of the day, starting on Friday it might not be messing up anymore. Thanks. Brant Burnett Pathfinder Software www.pfasoft.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Partially Visible Text In IE7
Brant Burnett wrote:
However, for some reason the text for the movie title on the very
last one doesn't always render correctly in IE7.
http://ppointe.pfestore.com/capacity/titles/ComingSoon.aspx
The IE/win 'stacking bug' is at play.
Try adding...
a {position: relative;}
...to get the links on top.
Maybe also a good idea to add...
html {font-size: 100%;}
...to kill the 'em font-resizing bug in IE5 - IE7'[1].
regards
Georg
[1]http://www.gunlaug.no/contents/wd_additions_13.html
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Partially Visible Text In IE7
Chris,
Thanks, that worked great. And I agree about the number of CSS classes, but
it is an application for use by multiple clients that need to be able to
style it to look like their primary website, so I need a lot of CSS hooks
for customization. Thanks again.
Brant Burnett
Pathfinder Software
www.pfasoft.com
-Original Message-
From: Chris Hardie [mailto:[EMAIL PROTECTED]
Sent: Thursday, May 15, 2008 11:51 AM
To: Brant Burnett
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Partially Visible Text In IE7
Hi Brant,
Hope this helps:
.capacitylisttitle
{
font-size: 2em;
margin-bottom: 0.5em;
display:inline-block;
}
You may want to look into paring down the number of classes you have.
Check out the section on classitis and divitis, it will help you
simplify your code:
http://developer.apple.com/internet/webcontent/bestwebdev.html
Hope that helps,
Chris
http://www.nextdesigns.ca
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Partially Visible Text In IE7
Hi Brant,
Can you not use descendent selectors instead?
I have done a lot of government work where we have a common layout for
all sites, but each site can have a distinct skin. What we did is create
a heavily commented CSS file that demonstrates how to apply different
styles to different areas of the page, so users only need to swap out
style rules for their own. You can then use more sophisticated
descendent selectors which will drastically improve the simplicity,
weight and readability of your markup, but your clients will still
understand how to effect their own changes.
My opinion, FWIW!
C.
Brant Burnett wrote:
Chris,
Thanks, that worked great. And I agree about the number of CSS classes, but
it is an application for use by multiple clients that need to be able to
style it to look like their primary website, so I need a lot of CSS hooks
for customization. Thanks again.
Brant Burnett
Pathfinder Software
www.pfasoft.com
-Original Message-
From: Chris Hardie [mailto:[EMAIL PROTECTED]
Sent: Thursday, May 15, 2008 11:51 AM
To: Brant Burnett
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Partially Visible Text In IE7
Hi Brant,
Hope this helps:
.capacitylisttitle
{
font-size: 2em;
margin-bottom: 0.5em;
display:inline-block;
}
You may want to look into paring down the number of classes you have.
Check out the section on classitis and divitis, it will help you
simplify your code:
http://developer.apple.com/internet/webcontent/bestwebdev.html
Hope that helps,
Chris
http://www.nextdesigns.ca
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with 4 column css
Carol Flax wrote: I'm trying to write a 4-column page and content in center columns is sliding under side columns. also - banner is sliding around when page is resized. help, please. I'm new to CSS and struggling. thanks! http://www2.whidbey.com/cflax/nwbaby_test/index.html Carol, The difficulty you are having may be primarily due to using absolute positioning (brittle) of the two center columns; and having fixed width elements (images) inside percent width columns. Setting overflow:hidden on both of the outer wrappers will open them to enclose the content. And changing the absolute positioning to float:left; may help. However, even at that, users who drag to a /narrower window than 990px/ or so will experience horizontal content crossover and float drop. Setting min-width of 990px and max-width of 100% could help prevent this (with javascript or IE expressions [1] for IE/6 which does not support min/max width). For someone new to CSS, all of this can be somewhat daunting. My /personal opinion/ is to keep it simple. Four fixed pixel width columns that all float left enclosed in a fixed width 960 up to around 980px wrapper will clear the scroll bar for those users at 1024, and provide a reasonable and readable text width measure for those users at 1280 and much, much higher screen resolutions. And it will make life much easier coping with the fixed width images, not to mention making it all happen in IE/6 and IE/7. If you prefer the primary content to be first in the document source order, try setting it up here [2] (I'd avoid the equal height columns for now). [1] http://www.gunlaug.no/contents/wd_additions_14.html [2] http://www.fu2k.org/alex/css/onetruelayout/example/interactive -- http://chelseacreekstudio.com/ David - thank you! I made all the changes you suggested: http://www2.whidbey.com/cflax/nwbaby_test/index-fix.html The top banner is still moving around and now there's extra space below the banner. Otherwise - very close to what I want. The other trick is that it has to match all the other 3 column pages (see any link from left sidebar). Is there any easy way to solve these last few problems? thanks so much, Carol -- Carol Flax [EMAIL PROTECTED] http://carolflax.net __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] top border for list items not showing in ie
On Thu, May 15, 2008 4:44 pm, Barb @ BITS LLC wrote: Hi - On this page -- http://www.rochesterhistory.org/about/ -- all the left hand navigational elements have a horizontal line between them. This is done by adding a border-top property. border-top:0.05px solid #EFAA7D; This shows in FF, but not in IE. What am I missing? The full css is at http://www.rochesterhistory.org/wp-content/themes/twister-10/style.css Two points: 1. IE has very little precision in units, and almost certainly won't recognise hundredths of a pixel; 2. Nothing can display any less than one pixel anyway - a pixel is an indivisible thing, so you should just set the size of the border to be 1px - either the browser will round it up to 1px or round it down to 0px, when it becomes invisible. HTH, Nick. -- Nick Fitzsimons http://www.nickfitz.co.uk/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] mysterious letter appearing only in IE6
There is something really mysterious going on here in IE6. In the top right there is a menu and in IE6, and ONLY in IE6, the letter e appears like a fourth link in the menu. http://raidesign.ca/test/test.html css: http://raidesign.ca/test/css/br.css http://raidesign.ca/test/css/ie6-hacks.css http://raidesign.ca/test/css/ie7-hacks.css I just can't figure out where this thing is coming from! Any ideas? Sandy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
In the top right there is a menu and in IE6, and ONLY in IE6, the letter e appears like a fourth link in the menu. http://raidesign.ca/test/test.html in my copy of IE6 (on WinXP) there's nothing at all above the large image, which is jammed right against the top of the window. my advanced straw-grasping abilities and ignorance of Canadian addressing makes me want to ask if this is really the address behind the image at the bottom of the page: 406 Des Pins )., Espace 71, Montreal QC the right paren period comma Espace seems, well, even odder than I remember Canada being. joel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
In the top right there is a menu and in IE6, and ONLY in IE6, the letter e appears like a fourth link in the menu. http://raidesign.ca/test/test.html in my copy of IE6 (on WinXP) there's nothing at all above the large image, which is jammed right against the top of the window. my advanced straw-grasping abilities and ignorance of Canadian addressing makes me want to ask if this is really the address behind the image at the bottom of the page: 406 Des Pins )., Espace 71, Montreal QC the right paren period comma Espace seems, well, even odder than I remember Canada being. joel Joel - thanks for looking and catching that typo. That was supposed to be an upper case O, as in Ouest, or West as you say down there. The page is designed to work in a 1024 x 768 window as the smallest size. If you are seeing the top of the big image as the first thing you see, you are probably in 800 x 600. Do you see the random e? Sandy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
Sandy wrote: In the top right there is a menu and in IE6, and ONLY in IE6, the letter e appears like a fourth link in the menu. http://raidesign.ca/test/test.html Sandy It is an IE/6 (duplicate characters) bug. If you are /lucky/ it may simply mean removal of one or more comments in the markup. This article [1] explains the bug and its resolution. [1] http://www.positioniseverything.net/explorer/dup-characters.html -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
Sandy wrote: In the top right there is a menu and in IE6, and ONLY in IE6, the letter e appears like a fourth link in the menu. http://raidesign.ca/test/test.html Sandy It is an IE/6 (duplicate characters) bug. If you are /lucky/ it may simply mean removal of one or more comments in the markup. This article [1] explains the bug and its resolution. [1] http://www.positioniseverything.net/explorer/dup-characters.html David - THANK YOU! that worked. wow. Thanks so much! http://raidesign.ca/test/nocomment.html Sandy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
There is something really mysterious going on here in IE6. Hi Sandy, I am not sure this is an IE6 bug. I am looking at your web site using firefox 2 and the top is shifted way off my screen. The problem is your outermost div (horizon) has top:50%; while the next div (container) inside has top:-310px; . In other words you are shifting down by a percentage of the screen height and then re-shifting up by a fixed amount. This is very dangerous since you don't know the height of a user's browser. I would suggest setting top: 0px; in both .horizon and .container. Best regards, Kepler Gelotte Neighbor Webmaster, Inc. 156 Normandy Dr., Piscataway, NJ 08854 www.neighborwebmaster.com phone/fax: (732) 302-0904 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing only in IE6
There is something really mysterious going on here in IE6. Hi Sandy, I am not sure this is an IE6 bug. I am looking at your web site using firefox 2 and the top is shifted way off my screen. The problem is your outermost div (horizon) has top:50%; while the next div (container) inside has top:-310px; . In other words you are shifting down by a percentage of the screen height and then re-shifting up by a fixed amount. This is very dangerous since you don't know the height of a user's browser. I would suggest setting top: 0px; in both .horizon and .container. Best regards, Kepler Gelotte hey Kepler, Thanks so much for looking at this for me. The top:50% divides the screen in half, and the top:-310px takes half the site, which will be a fixed height, up above the screen center. The site will only work in a 1024+ browser. Since my client is targeting art directors, it's crucial that it center vertically in a big monitor, and no big deal if people with small monitors can't see it properly. If you don't have a big screen, you're not going to hire this person! cheers, Sandy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] mysterious letter appearing in GECKO
I also have a mysterious letter I've been unable to track down. http://monday6o.org/attend2.php It's the letter 'i' appearing just above the table and to the right of the menu column. It is not in the html. -- Where are we going, and what are we doing in this handbasket? Rick Pasotto[EMAIL PROTECTED]http://www.niof.net __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing in GECKO
I see it, I see it... Right under the div id=main tag I see a i all by itself. Cory -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Rick Pasotto Sent: Thursday, May 15, 2008 2:04 PM To: css-d@lists.css-discuss.org Subject: [css-d] mysterious letter appearing in GECKO I also have a mysterious letter I've been unable to track down. http://monday6o.org/attend2.php It's the letter 'i' appearing just above the table and to the right of the menu column. It is not in the html. -- Where are we going, and what are we doing in this handbasket? Rick Pasotto[EMAIL PROTECTED]http://www.niof.net __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing in GECKO
On Thu, May 15, 2008 at 3:04 PM, Rick Pasotto [EMAIL PROTECTED] wrote: I also have a mysterious letter I've been unable to track down. http://monday6o.org/attend2.php It's the letter 'i' appearing just above the table and to the right of the menu column. It is not in the html. Look at the end of this line in the HTML: tfoot trtdTotal Attendance/tdtd10/tdtd15/tdtd14/tdtd10/tdtd16/tdtd16/tdtd19/tdtd10/tdtd15/tdtd16/tdtd13/tdtd18/tdtd15/tdtd16/tdtd17/tdtd15/tdtd12/tdtd15/tdtd18/tdtd0/tdtd0/tdtd0/tdtd17/tdtd15/tdtd0/td/tri /tfoot Your i is hanging out there. -- Bryce Fields http://www.kentucky.gov/ Do or do not! There is no try! -- Yoda __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mysterious letter appearing in GECKO
I should say that in Firebug it shows, but in the HTML it doesn't. Must be a space or some character that WORD put in or one of the oddities... Just backspace that table id=attend right up to the div id of main to remove it. Cory -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Cory Shubert Sent: Thursday, May 15, 2008 2:11 PM To: Rick Pasotto; css-d@lists.css-discuss.org Subject: Re: [css-d] mysterious letter appearing in GECKO I see it, I see it... Right under the div id=main tag I see a i all by itself. Cory -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Rick Pasotto Sent: Thursday, May 15, 2008 2:04 PM To: css-d@lists.css-discuss.org Subject: [css-d] mysterious letter appearing in GECKO I also have a mysterious letter I've been unable to track down. http://monday6o.org/attend2.php It's the letter 'i' appearing just above the table and to the right of the menu column. It is not in the html. -- Where are we going, and what are we doing in this handbasket? Rick Pasotto[EMAIL PROTECTED]http://www.niof.net __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Select tag based on descendant tag attribute?
-Original Message-
Message: 5
Date: Mon, 12 May 2008 18:42:11 -0700 (PDT)
From: George Adders [EMAIL PROTECTED]
Subject: Re: [css-d] Select tag based on descendant tag attribute?
To: css-d@lists.css-discuss.org
Message-ID: [EMAIL PROTECTED]
Content-Type: text/plain; charset=iso-8859-1
...
With the given information, the answer is no, you can't select an
element on the basis of inner markup (like an attribute of a
descendant)
Thank you for confirming.
George,
Yesterday I came across code examples that allowed CSS rendering
of specific image elements referenced to their width and height
Measurements using;
IMG[height=60][width=468], IMG[height=60px][width=468px]
{display: none !important;}
This was intended to restrict the display of specific ad image sizes.
Not sure if this would work also for a src= or not. I'm sorry I
don't have time to test it, maybe someone else has seen this?
Check out:
http://www.oreillynet.com/pub/a/network/2000/07/21/magazine/css_anarchis
t.html?page=2
~Tawnya Walker.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Select tag based on descendant tag attribute?
Tawnya wrote:
With the given information, the answer is no, you can't select an
element on the basis of inner markup (like an attribute of a
descendant)
[...]
Yesterday I came across code examples that allowed CSS rendering
of specific image elements referenced to their width and height
Measurements using;
IMG[height=60][width=468], IMG[height=60px][width=468px]
{display: none !important;}
That's a known technique, and usually used in _user_ style sheets to
block ads, at the cost of accidentally blocking other images as well.
Doesn't work on IE 6.
But it has nothing to with the question about selectors based on inner
markup. It's simply an application of attribute selectors.
Jukka K. Korpela (Yucca)
http://www.cs.tut.fi/~jkorpela/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Movable content
Not sure if this is a css question or now but I can not think of anywhere else to look... On the new www.bbc.co.uk website and igoogle you have the ability to move the objects around, anyone know how the heck I do that? Cheers, Andrew __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check -- IE6 problems
Hi Chris,
Thanks for the info.
The general layout of the site, and the use of the AP divs, is to accomplish
two very simple -- or what is simple with IE7 and FF2 -- things.
First, the header and the footer regions get glued to the top and bottom
of the viewport. This is working in IE6 okay as well.
Second, that the center navigation bar and content regions, *fill* the
remaining vertical space in the viewport, and that any overflow is clipped
at the start of the footer with a scrollbar to handle viewing of the
overflow.
I create two temporary pages for acid testing:
www.areteam.com/ie6-short.html and www.areteam.com/ie6-long.html. These are
copies of the existing HOME and PHILOSOPHY pages, however they are devoid of
any PHP and include an ancillary ie6.css style sheet for shits-and-giggles
to figure this problem out.
I'm not sure I *completely* understand your comment of...
style
#page-bg-body {border:1px solid red;} /style
In IE, it has no height because it has no children still in
document flow. Since it has no height, it won't tile down the
length of the page as you expected.
I realize that a DIV will collapse down based on it's content, however why
then does the HEIGHT:100% properly address the situation -- at least
visually with respect to the background image -- on IE7 and FF2, whereas IE6
does not? Does IE6 treat that property differently.
Holding aside the issue of the descendant DIVs' contents not filling the
viewpoint, there are some issues, that are also coming into play...
A) The background image of DIV#PAGE-BG-BODY is not appearing at all. This
background includes the white area on the left and right sides of vertical
divider bar, with a drop shadow off of the right edge. You can see this in
the masthead -- note the drop shadow off of the right-hand side -- but not
in the BODY area. (This is the most puzzling aspect of this.) In addition,
when I add indicate borders to the three problematic DIVs, I can see that
the space they occupy should not cause any clipping of the background
graphic.
B) On long pages (see: www.areteam.com/ie6-long.htm) the content spills out
of the containing DIV. This seems to go back to the HEIGHT property issue.
IE6 seems to ignore the containing DIV's HEIGHT and OVERFLOW properties. It
also seems to ingore the BOTTOM property -- when I did try it, and simply
let's anything spill out. The only exception I have found is if I include a
specific measurement in the HEIGHT property.
Now that last bit would work just fine if I could dynamically calculate the
height based on (viewport available height LESS height of header and footer
regions). This is specifically why the AP DIVs came into play, because I did
not want to have to dynamically manipulate the DIV heights via JavaScript or
PHP.
My goal is to get this working the same on IE6 as it does in IE7 and FF2.
This seems like something that should be fairly straight forward, but it's
not. (I can understand having it degrade gracefully, but I'm not necessarily
accepting that path for IE6. IE5? Sure. NN4? Sure. IE6...... no.)
As far as I can see, this comes down to addressing the styles on three
elements: DIV#PAGE-BG-BODY, DIV#BODY-NAVBAR, and DIV#BODY-CONTENTS. Right?
Last, I do know that the BOTTOM property is being honored, where I'm not
trying to stretch something to fill the viewport, because the footer is
fixed to the bottom of the viewport as it should be.
Now I'm just beating about on blind garden paths. So what is suggested as a
next step to addressing this to achieve the desired effect?
...Rob
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Movable content
Andrew Doades wrote: Not sure if this is a css question or now but I can not think of anywhere else to look... On the new www.bbc.co.uk website and igoogle you have the ability to move the objects around, anyone know how the heck I do that? Hi Andrew, This is not actually CSS, though CSS is certainly implemented for the look and feel. Aside from some pseudo-element styling, moving elements on the fly is not possible with CSS (that I'm aware of). The BBC folks (and similar sites) are using javascript. In BBC's case, JQuery is used to accomplish the drag-and-drop functions (as well as others, no doubt). More information about JQuery can be found here: http://jquery.com/ Hope it helps! Bill Brown TheHolierGrail.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check -- IE6 problems
Last, I do know that the BOTTOM property is being honored, where I'm not trying to stretch something to fill the viewport, because the footer is fixed to the bottom of the viewport as it should be. Hi Rob, Nice site. I like the overall look and feel, now...onto your troubles. Your problem with this design begins with #page-bg-body which does not have an explicit height setting. IE6 will honor top OR bottom settings with absolute positioned boxes, but as you're finding out, it does not calculate height when both properties are set. This breaks your layout because the #body-contents box which DOES have a height set explicitly in your style sheet cannot calculate 100% of NULL, which is the value of the #page-bg-body box. Thus in IE6, it defaults to visible overflow. In this case, you might want to try using CSS expressions to feed IE6 a line of style that it could evaluate, thus calculating the height it should be, minus your header and footer (I didn't analyze these components very closely so forgive me if the IDs are wrong). If you have trouble finding info on CSS expressions in IE or with creating the expression code, let me know -- I should be able to whip something up for you. Hope it helps! Bill Brown TheHolierGrail.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] site check -- IE6 problems
Cool Bill, Thanks! That gives me a possible sense of direction, which is what I was looking for. I'll let you know how it works out. (Worst case scenario -- as I mentioned to Chris in an off-list message -- is that I could dynamically rewrite the HEIGHT property value in IE6 using Javascript nested in a conditional IE comment. Not what I want to do, but it would be a solution -- of sorts. ...Rob -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Bill Brown Sent: Thursday, May 15, 2008 5:44 PM To: Rob Emenecker Cc: css-d@lists.css-discuss.org; 'Chris Hardie' Subject: Re: [css-d] site check -- IE6 problems Last, I do know that the BOTTOM property is being honored, where I'm not trying to stretch something to fill the viewport, because the footer is fixed to the bottom of the viewport as it should be. Hi Rob, Nice site. I like the overall look and feel, now...onto your troubles. Your problem with this design begins with #page-bg-body which does not have an explicit height setting. IE6 will honor top OR bottom settings with absolute positioned boxes, but as you're finding out, it does not calculate height when both properties are set. This breaks your layout because the #body-contents box which DOES have a height set explicitly in your style sheet cannot calculate 100% of NULL, which is the value of the #page-bg-body box. Thus in IE6, it defaults to visible overflow. In this case, you might want to try using CSS expressions to feed IE6 a line of style that it could evaluate, thus calculating the height it should be, minus your header and footer (I didn't analyze these components very closely so forgive me if the IDs are wrong). If you have trouble finding info on CSS expressions in IE or with creating the expression code, let me know -- I should be able to whip something up for you. Hope it helps! Bill Brown TheHolierGrail.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] star hack /tan hack or what ? a question...
Hello,
I have used hack for ie6 :
div.someclass {
width: 300px;
* width: 320px;
}
which is it is different than the standard star selector hack, i.e.
* html div.someclass {
width: 320px;
}
what is the first example called ? is it an improper interpretation of
the star selector hack. I want to know if I should use it ?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] star hack /tan hack or what ? a question...
On Thu, 15 May 2008 16:32:54 -0700, corey deep wrote:
Hello,
I have used hack for ie6 :
div.someclass {
width: 300px;
* width: 320px;
}
which is it is different than the standard star selector hack, i.e.
* html div.someclass {
width: 320px;
}
what is the first example called ? is it an improper interpretation of the
star
selector hack. I want to know if I should use it ?
I think you meant to show the star next to the width property name, no?
No space between.
It is a true hack, as property names do not begin with a star. IE 5 - 7
ignore the star, and apply a width of 320px. Other browsers correctly
ignore that declaration and apply a width of 300px.
The star selector or Tan hack (example 2) does not apply to IE 7.
FWIW - you can also target IE 5 - 6 and leave IE 7 alone by using an
underscore instead of a star.
It seems to be popular. I use it as a quick fix while debugging.
Don't know what it's called, though.
Cordially,
David
--
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Standard filling column space problem ...
I know you get this question every few days but my layout seems to be unique enough that I still can't get the right column in my three column layout to fill out the background color(s): http://www.ioplex.com/~miallen/t12.html I'm hoping someone can look at this and point out a simple solution. The closest I've gotten is adding: padding-bottom: 1px; margin-bottom: -1px; to l-top div, l-mid div and l-low div definitions but that causes Safari to drop trow. The background image trick doesn't seem to apply given the tri-color rows. Ideas? Mike __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] star hack /tan hack or what ? a question...
FWIW - you can also target IE 5 - 6 and leave IE 7 alone by using an underscore instead of a star. I wish I knew about this hack earlier in the week. ;) However, I notice you both specify 'width:' declarations. Does this hack work with 'height:' as well? -- Glen Barber http://www.dev-urandom.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Menu Positioning Question
Hi, We have a design which has two sets of menus and we would like to give every designer control on laying out the menus using their own CSS. The HTML that we are looking at is extremely simple. --- div id=Menu2 ul lia href=#Home/a/li lia href=#Contact us/a/li li class=lasta href=#Sitemap/a/li /ul /div div id=Menu2 ul li class=titleLanguages:/li lia href=# class=SelectedEnglish/a/li lia href=#Dutch/a/li lia href=#French/a/li lia href=#Italian/a/li li class=lasta href=#Spanish/a/li /ul /div While this html gives us the flexibility to place and display the individual menus independent of each other, it does not cater for the usecase where we have to place both of these menus horizontally aligned with the same background shades. Is this doable with this html or do we need to change the html? Regards, Sohail __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] star hack /tan hack or what ? a question...
Glen Barber wrote: I wish I knew about this hack earlier in the week. ;) However, I notice you both specify 'width:' declarations. Does this hack work with 'height:' as well? Sure. IE5 - 7 eats most non-valid character you can think of in front of any property-name... http://annevankesteren.nl/2005/07/ie-hack http://annevankesteren.nl/2007/02/ie7-css-hacks ...and will apply the styles. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Reduce space above characters?
Is there any way to reduce the space above characters. Consider the following: http://www.ioplex.com/~miallen/t14.html Setting line-height: 0.5; has no effect on the space above Apples. There's at least 4 whole pixels above the A and l in this example. Is there any way to reduce that? Mike __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Reduce space above characters?
Is there any way to reduce the space above characters.
Hi Mike,
You are setting the line-height on a span element. Spanned elements are
inline and that is why it is ignoring line-height. Try a block element like
div or p instead. If you want the background to fit just the content,
float the block element as well:
body
div id=testApples/div
/body
---
div#test {
float: left;
background: #FF none repeat scroll 0%;
line-height: 1em;
}
Best regards,
Kepler Gelotte
Neighbor Webmaster, Inc.
156 Normandy Dr., Piscataway, NJ 08854
www.neighborwebmaster.com
phone/fax: (732) 302-0904
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with 4 column css
Carol Flax wrote: I'm trying to write a 4-column page and content in center columns is sliding under side columns. also - banner is sliding around when page is resized. help, please. I'm new to CSS and struggling. thanks! http://www2.whidbey.com/cflax/nwbaby_test/index.html Please see http://www.chelseacreekstudio.com/ca/cssd/nw1.html. We'll need to talk if you need an explanation, a need to support min/max width in IE/6.0; or, the need to support IE/5x. Or something like that. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Reduce space above characters?
Michael B Allen wrote: Is there any way to reduce the space above characters. Consider the following: http://www.ioplex.com/~miallen/t14.html Setting line-height: 0.5; has no effect on the space above Apples. There's at least 4 whole pixels above the A and l in this example. Is there any way to reduce that? For a valid construction - yes. However, if you want to only reduce the space _above_ characters - visually - then you may have to tune line-height and use offset... http://www.gunlaug.no/tos/alien/mba/test_08_0515.html regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Last-minute question
I just remembered that I had to reapply min/Max width expressions for the 3 container elements of a website and I discovered that IE6 is doing strange things with the companion column as a result (On a window wider than 1440px it extends the white background of the content colum to the left by the same amount as the space to the right of the globalwrapper. Since the site has just gone live, I duplicated the template and created a test page: http://www.vine.org.nz/index.php/test-page (My guess is that there is something in the companion column method that is assuming 100% width that I haven't spotted) -- Richard Grevers, New Plymouth, New Zealand Dramatic Design www.dramatic.co.nz __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] problem with vertical menu list
Hi,
I’m using the below vertical menu list but unfortunately when a menu item is
clicked to produce an ‘active state’, it doesn’t remain on when the user
clicks on other links on the web page. As soon as you click on any other
links the ‘active menu state’ reverts to a ‘normal state’. Can anyone
explain why this happens?
Thanks,
Jasmin
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style: none;
}
#menu {
top: 145px;
left: 2px;
width: 195px;
POSITION: fixed;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
HTML #menu {
POSITION: absolute
}
#menu dt {
cursor: pointer;
margin: 6px 3px;
height: 22px;
line-height: 22px;
text-align: center;
border: 0px solid white;
background-image: URL(images/button.gif);
background-repeat: no-repeat;
}
#menu dd {
border: 0px solid white;
}
#menu li {
margin: 15px 0; /* Lists the vertical spacing between secondary
level links */
background-repeat: no-repeat;
background-image: URL(images/submenu_button.gif);
text-align: center;
line-height: 22px;
}
#menu li a, #menu dt a {
color: black;
text-decoration: none;
border: 0 none;
height: 100%;
}
#menu li a:hover, #menu dt a:hover {
display: block;
background-image: URL(images/ button_over.gif);
background-repeat: no-repeat;
text-align: center;
line-height: 22px;
text-decoration: none;
}
#menu li a:active, #menu dt a:active {
display: block;
background-image: URL(images/ button_on.gif);
background-repeat: no-repeat;
text-align: center;
line-height: 22px;
text-decoration: none;
}
No virus found in this outgoing message.
Checked by AVG.
Version: 7.5.524 / Virus Database: 269.23.16/1433 - Release Date: 14/05/2008
4:44 PM
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
