Re: [css-d] respond.js vs ie7 and ie8 (correction)

[Duncan Hill]

On Wed, 25 Apr 2012 15:36:30 +0100, Ellen Herzfeld  wrote:



On 25 Apr 2012, at 11:48, Duncan Hill wrote:

This could potentially drift off-topic for CSS-D as it is more based on  
JavaScript being used to apply styling, and without specific CSS  
queries one of the other lists may have more help to offer.


You are right, but in this case, I had no way of knowing if my problem  
came from the javascript or the CSS, or possibly both.


Seems the JavaScript is failing to provide the correct styling for IE8.


selectivizr requires a JS framework, it would seem prudent to load the  
framework first (jquery)


I'm using nwmatcher with selectivizr because jquery has incomplete  
support (and is missing things I need). I know that makes for a lot of  
js for IE 6/7/8 but it's that or nothing. Anyway, this is just a test  
run. I'll get into optimization later.


The point was that selectivizr 'requires' jquery, it is loading and  
probably triggered 'before' the jquery is available.




I still don't understand this part:





that seems to conditionally serve the stylesheets to IE6+, yet it also  
serves them to all browsers.




Yes, that is the point. IE less than 6 doesn't see the stylesheets that  
are served to all other browsers. Actually, this is something that is a  
holdover from a site that was made a few years ago, when IE 5 and 5.5  
were still around and I had decided that enough was enough for those  
two. So I suppose I could remove it now, since hopefully IE 5 and 5.5  
are dead and buried. I'm still trying to cater to IE6, but my latest  
tests cause it to crash on a regular basis. I haven't decided what I'll  
do about that yet.


If it is no longer needed or relevant, it should be removed to eliminate  
it as a cause.


It's a bit difficult trying to do "mobile first" and still serve a  
desktop site to IE < 9. But it's been difficult with IE for years...


Fully prepare your mobile site for the browsers that can natively handle  
the styling correctly, then you have a solid base to pick off specifics  
for the less capable.

Are there really a lot of IE < 9 'mobile' browsers still in the wild ?


I think you are right and I should go elsewhere with my problem.


There have been many discussions on this list about solving problems with  
@media and mobile styling, I'm sure much better advice will come if you  
are more focused on the CSS first.


Good luck

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] respond.js vs ie7 and ie8 (correction)

[Duncan Hill]

On Tue, 24 Apr 2012 15:52:33 +0100, Ellen Herzfeld  wrote:




Yes, I'm sorry but another error creeped in somewhere and really messed  
everything up. I must have been tired when I did this, but it's now  
fixed. However this doesn't change my problem with IE7/8. Could you look  
again, please?


The page  should now show  
styling everywhere (headers and dls centered, image to the right), but  
in IE 7/8 the spacing between paragraphs is gone and fonts are not  
correct. In IE7 the headers are bold and sans-serif but too small. In  
IE8 the headers are not bold, too small and set in a serif font instead  
of sans-serif. The line-height and top and bottom margins are gone in  
both. In all other browsers including IE9 there is no problem.


On the other page , I  
removed the media queries and respond.js. This way in all browsers (even  
IE 7/8), what I see is the page styled correctly for wide viewports.  
Fonts and spacing are good in IE 7 and 8. So the problem has nothing to  
do with the css itself.


With respond.js, the styles in the media queries are obviously seen by  
IE, but I can't figure out why, in this specific page, there is a  
problem with typography and spacing. And it really is a very simple page.


I'm thinking of just serving a specific desktop stylesheet to IE with a  
conditional comment if I can't find where the problem is.


Or maybe, if this problem is confirmed by others (on this list for  
example), I'll file a bug for respond.js.


Thanks for your help.

Ellen

This could potentially drift off-topic for CSS-D as it is more based on  
JavaScript being used to apply styling, and without specific CSS queries  
one of the other lists may have more help to offer.


First, IE7 is responding better, as are other browsers.

Your code from Paul Irish is modified from his published work. Check that  
those mods are reflected in all areas.

http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

selectivizr requires a JS framework, it would seem prudent to load the  
framework first (jquery)


Google say html5.js can be loaded before or after CSS, but they also note  
the potential for reduced performance.


I still don't understand this part:





that seems to conditionally serve the stylesheets to IE6+, yet it also  
serves them to all browsers.

Is it really required, or is it simply an extra point of failure.
As I see it, the scripts are intended to work from a standard valid  
stylesheet by searching for elements that require modification to enable  
IE, therefore the conditional is superfluous.
I always figure that having only things that have a specific purpose  
leaves less room for error.
Maybe I'm missing something about conditional comments and JavaScript,  
neither of them are my forté.


Best wishes

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] respond.js vs ie7 and ie8 (correction)

[Duncan Hill]

On Mon, 23 Apr 2012 16:11:58 +0100, Ellen Herzfeld  wrote:

My previous message points to the wrong file without the media queries :  
it should be


http://qd.xlii.org/2012/content_modules-ie8.html

By the way, I checked without selectivizr and it doesn't change the  
problem.


Ellen


Both this page and the one you posted previously are having problems, I  
suspect it is your conditional comments that are preventing load.

Check the syntax, and maybe the logic of how the IE versions are targeted.








if I read this one correctly, the 'not' operator ! should be directly in  
front of the lt, '!lt', however there is a closing of that conditional  
which feeds the linked sheets to everything (correctly I guess), then it  
is followed by the real closing statement for the conditional.
Perhaps the slight mish-mash is upsetting IE, and isn't [if !lt IE 6] the  
equivalent of [if gte IE 6], but in a slightly more convoluted way.
Similar coding applies for your language declaration, maybe those classes  
appear at some stage (class="lt-ie9 lt-ie8 lt-ie7" etc.) but the section:




surely just ends up serving  to everything.

on XP
IE8 'sometimes' shows the page, but with little styling, into IE7 mode and  
no content is visible.
FF 11.0 will not let me switch away from a 'Handheld' media type for the  
CSS and is not showing anything like the styling that appeared on your  
first posted link.


on Win7
IE9 shows as FF, IE8 and IE7 modes show content but move your image from  
the right to the left of the page.


Best wishes

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] ie 6/7/8

[Duncan Hill]

On Mon, 23 Apr 2012 19:39:14 +0100, David Laakso  
 wrote:




Good Morning, Vietnam!

Thank you for confirming the page is set to a single column 580px
fixed width  for IE/6 and IE/7 and, that is it is set to two columns
97% width folding to two-columns min-width at 580px in  IE/8.

Best,
David Laakso



I doubt you will be concerned but IE5 is upset by the scripts, other than  
that it shows in the same configuration as IE6 and is certainly functional.


Best wishes

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] extra blank rows in table to fill window.

[Duncan Hill]

On Thu, 08 Mar 2012 10:36:34 -, David Thorp  
 wrote:


I agree, the nested tables are not great, but I hit all sorts of  
problems trying to do it with divs and floats, and while I had a couple  
of helpful tips from people on this list about that I haven't got my  
head quite around them yet.  A couple of people suggested it's not so  
bad to do it in tables, but I'd still like to do it without them.  So  
I'll be returning to that particular goal later.


In the meantime, thanks for your demo, although that doesn't really  
achieve what I'm trying to achieve.  The purpose is for each row of the  
table to be alternating colors.  It's not just a pretty pattern to sit  
behind the table.


Maybe you're onto something with the CSS3 gradient idea.  Perhaps the  
ideal solution would be somehow programmatically generating the  
background "image" to match the row height.  Perhaps I'll look into  
that.  Any thoughts?


David.



Try taking a look at CSS3 'nth-child'

It isn't supported in IE before IE9 (Ithink) but for the older browsers it  
can be enabled very simply with a little bit of jQuery.

http://dev.opera.com/articles/view/zebra-striping-tables-with-css3/
or
http://css-tricks.com/how-nth-child-works/
if you look through CSS-Tricks I seem to remember that there was an  
article describing the addition of jQuery when required.


The striping of your tables is not your main worry at the minute, you  
should be looking more at creating a stable page, handle the 'striping' as  
an 'enhancement'.


Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] @Fontface Not Working?

[Duncan Hill]

I also think you're convinced it's an absolute path issue but it's not.  
You get an error message because I'm a WP and it's PHP driven and  
directories just work a little differently - people just cant get direct  
access to a directory on WP, just because it exist - it just doesn't  
work that way. And as already stated several times FF doesn't render the  
font even w the absolute path.


Someone else already responded that there was an issue w the font itself  
a corruption of some sort which is what I was suspecting and I was able  
to check it out in a font programmer which confirmed it was an altered  
version of the original. At this point, I am moving on to another font.  
And I will set up my @font-face the same way and send you a link  
directly to see what happens.


Elli


On both your sites, the primary issue is the URL for the font.
http://www.e7flux.com/clients/sof/
'littledays.ttf' is being requested from
http://www.e7flux.com/clients/sof/css/fonts/littledays.ttf while it  
appears to be living at

www.e7flux.com/sof/fonts/littledays.ttf
the same link structure exists for the Candara font on that site.

Similarly
http://www.e7flux.com/e7flux2012/ requests its 'Creampuff.ttf' from
http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf but it is living  
in

www.e7flux.com/e7flux2012/fonts/creampuff.ttf


You can test that easily for yourself by clicking the links, you will  
receive a 404 error or a download option as appropriate.


So far you cannot really class this as being related to CSS.
I have not tested if the creampuff.ttf is corrupted as FF suggests it is.

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] @Fontface Not Working?

[Duncan Hill]

Hi Barney!

Ok so I tested on latest versions of Chrome, Opera, Safari for Windows,  
IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm  
having the problem. I tested in both FF3.6 & 9 and what you see on those  
versions of FF, is the fallback font (Brush Script STD) of  the font  
stack. The other browsers render "Creampuff" as it should. Please find  
link below:


http://www.e7flux.com/e7flux2012/



"Creampuff" is not loading in any browser that I have.
Brush Script STD is not installed so I get fallback to 'Cursive' which is  
rendered as MS Comic Sans.


WinXP: Opera 11.60, Chrome 17, Iron 16, FF 9.0.1, IE 7 & 8

Duncan
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] what font is being called?

[Duncan Hill]

On Tue, 11 Jan 2011 19:32:31 -, Rory Bernstein  
 wrote:



Hello,

When I have a series of fonts being called in a font-family rule, how do  
I know which one is the one being chosen?


On this page:
http://mcgivney.ehclients.com/locations/

The font should be the Titillium for the whole page, but of course it  
gets complicated when there are browsers that cannot show this font and  
it falls back to the next font in the stack, which is Tahoma, then Arial.


How do I know which one the browser is giving me?


'FireFontFamily' [1] addon for the Firebug [2] extension with FireFox

[1] https://addons.mozilla.org/en-US/firefox/addon/111672/
[2] https://addons.mozilla.org/en-US/firefox/addon/1843/

Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] How to make the background wrap around the image?

[Duncan Hill]

On Thu, 30 Sep 2010 07:22:44 +0100, Anthony  wrote:


Sorry about that. Hope it makes more sense now:




Apply overflow: hidden; to your #block-12 .blockinner rules and the div  
will contain the image.


The revised code that you provided is broken, and the fix above 'may' not  
fix the other (future?) problems to your satisfaction.
I've added background colours to the other divs so you can see more  
clearly what is going on with your positioning etc.






#block-12 .blockinner {
 background-color: #F2F2F0;
 margin:0 auto;
 border: 1px solid red;
 overflow: hidden;
}
#block-12 .blockinner .top {
 height:50px;
 width:100%;
 background-color: #FF00FF;
}
#block-12 .blockinner .border {
 margin:-44px 0 0;
 padding:1px 6px;
 position:relative;
 background-color: #008000;
}
#block-12 .blockinner .bottom {
 height:7px;
 width:100%;
 background-color: #00;
}




  
 

  This is a title which I dont really care about

  
http://www.google.com%22%3e%3cimg";>I dont really care about this text either I just
wish that the red border would include the image on the left, and be  
wrapped

around it nicelly, as opposed to half way down the image...
  

 
  




Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Capitalize

[Duncan Hill]

On Sun, 26 Sep 2010 10:07:58 +0100, Chris Blake   
wrote:



Hi,

i am not too fussed about the title transforming because I can just  
enter that manually as UC. However I dropped it in so that the question  
had something to do with CSS.


 From people's answers about the URL being UC it seems that it's just a  
bad idea - so I'll just have to go normal.


Thanks for all the info.

CB


Off-Topic but for clarification RFC 4343 states that URL's are  
case-insensitive.


Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] "Legal" format lists

[Duncan Hill]

On Fri, 24 Sep 2010 10:05:40 +0100, Geoff Lane  wrote:


On Friday, September 24, 2010, 9:52:45 AM, Alan Gresley asked whether
the markup was OK for HTML 4.01 Strict.
---

Unfortunately not. I have to confess to being a naughty boy and using
deprecated attributes in the HTML! One day I'll learn enough about CSS
to be able to do away with them, but for now I need to get this one
document out by the beginning of next week and so I'll have to leave
that for a later date!

That said, I appreciate the pointer to some very good reasons to get
away from 4.01 Transitional as soon as possible!

Many thanks,

 Even a fully qualified transitional Doctype should trigger Standards Mode  
in IE


http://www.w3.org/TR/html4/loose.dtd";>
and so give you the benefit of stability (predictability?) on your pages.


As you are adding the section numbers manually, Thierry's CSS example  
should work just as well on a  where all you need to do is cancel the  
bullet default with

list-style-type: none;
I can't say it will improve semantics or give other benefits other than it  
might make your code easier to prepare and edit thanks to the separation  
from the li's.


Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] IE problem navigation and other info moving over.

[Duncan Hill]

On Tue, 21 Sep 2010 20:33:52 +0100, Carol Swinehart  
 wrote:



http://www.bowenhouse.org/

This looks fine in the other browsers

I need a fix for IE that doesn't break the other browsers.

Thanks,

Carol


Try removing:

position:absolute;
margin-left:560px;

from your #navigation rules.

Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Seeking browser compatibility

[Duncan Hill]

On Thu, 16 Sep 2010 01:24:40 +0100, Keith Purtell  
 wrote:



In my search for information about accommodating different browsers,
I've come across four recommended approaches:
1-Write a JavaScript to load separate style sheets.
2-Use JavaScript to write "local" css in the page header.
3-Use conditional comments to insert JavaScript or css into the header.
4-Write a single css style sheet that is cross-browser.

A typical example of a problem I'm trying to deal with is IE ignoring
max-width. I've found the least info about option 4; not sure it's
possible? PS I'm trying to accomplish this without server-side
functions. My cheap-o agreement with my hosting service limits me to
plain html and css documents.

Sites advocating these different approaches seem credible, so I'm left
with the problem of figuring out which is best. I'd rather ask you folks
than run tests that someone else has already performed.

- Keith Purtell

#1 + #2 will fail in a JavaScript disabled or non-capable browser.  
JavaScript should sensibly be used to 'enhance' the user experience, not  
to provide basic page functionality.


#3 is a common practice for providing modified stylesheet/s only to  
versions of IE, and is a handy way of introducing a small piece of  
JavaScript that will let IE6 make use of pseudo classes for hover.
A modified stylesheet for IE versions linked through a conditional comment  
will not be seen or loaded by the other mainline browsers as the  
conditional comment is a MS proprietary browser instruction.

IE version targeting can be specific to each browser version.
The sheet only needs to contain the 'variations/hacks' required providing  
that the conditional comment follows the links to the main stylesheet.
If stylesheet validation is important to you, this method will allow your  
main stylesheet to remain fully valid.


#4 Not as difficult as you seem to suspect, David has provided a couple of  
the important 'hacks' to target IE. They will be ignored by other browsers  
but may prevent validation of your stylesheet which isn't the end of the  
world in many cases.


Much more important, in my opinion, is to write clean CSS that is focused  
carefully on what you are aiming for in terms of style, i.e. don't throw  
in rules for the kitchen sink if you don't have a kitchen sink on the site!
Test and design in a fully compliant browser, THEN pick up the pieces for  
Internet Explorer.


IE 8 will be reasonably steady with CSS 2 / 2.1
IE 7 trips up here and there but is not too hard to push into shape.
IE 6 is far from dead (as most would wish), some things are fairly easy to  
correct, or you could opt for just providing it with a basic style via  
conditional comments.


CSS 3 is only possible in any of them with the help of JavaScript.

Best wishes

Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Slideshow images: How'd he do that!?

[Duncan Hill]

Ah! but how many of those posts were about email clients ?? :)  :)

Best wishes

Duncan

off-list for fear of Eric!




Must be a different webdesign-l list from the one I'm on.  It's pretty
lively most days.  Checked your spam folder lately?

Val

__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Slideshow images: How'd he do that!?

[Duncan Hill]

On Wed, 01 Sep 2010 13:21:37 +0100, Brian M. Curran  
 wrote:



Hello,

I'm going to be submitting an article to a site, and I'd like to be
technologically on par with it. This may be stretching the limits of
this css list, but I looked at the site's css for images that the site
is using that are working in a slideshow fashion, but I can't see how
it is being done. The slideshow may be accomplished by css (doubt it),
or something else??? The page with the images acting in a slideshow
fashion is:


http:// www. Cadtutor .net/tips/index.php



Duncan Hill

I may be missing something obvious . I can't see a 'slideshow'
anywhere on that page.
There are 2 animated gif's but that to me is the only activity.
There is no apparent JavaScript in the source that would control a  
slideshow, and the CSS does not hint at any slideshow.



is there a reason for the spaces that you always seem to add to your  
links?



Duncan



Hello Duncan. That's what I was talking about, that is, the gifs that  
are animated. I likened them to a slideshow effect, but I didn't mean  
slideshow literally. I've never seen something like that before, hence  
my post. The other responder to my post seemed to say that it was a  
JavaScript effect. I haven't re-looked at it yet to confirm that. If you  
know how the gifs are animating, then please share.


As for the spaces in urls: Every time a url is posted to this site it  
creates a link that lives on the web. I already have a ton of them to my  
personal site, and I don't want them. A trillion "garbage" links  
pointing to a website could possibly not be the best thing for a  
website's rankings in Google's SERPs. This is a debatable SEO topic.  
Ergo the spaces, to play it safe.


-Brian


Brian,

Animated Gif's are a very old technique, Kevin provided a link for further  
research and I'm sure Google will turn up many more.
They need no added support from CSS or Script, but be aware that browsers  
can disable 'animations'.
Webdesign-l etc would be better to take this because List-Mom is sure to  
be preparing the Sword of Damocles for this thread now.


Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Slideshow images: How'd he do that!?

[Duncan Hill]

On Wed, 01 Sep 2010 12:23:21 +0100, Brian M. Curran  
 wrote:



Hello,

I'm going to be submitting an article to a site, and I'd like to be
technologically on par with it. This may be stretching the limits of this
css list, but I looked at the site's css for images that the site is  
using

that are working in a slideshow fashion, but I can't see how it is being
done. The slideshow may be accomplished by css (doubt it), or something
else??? The page with the images acting in a slideshow fashion is:


http:// www. Cadtutor .net/tips/index.php


(remove spaces)


Thanks,

Brian

I may be missing something obvious . I can't see a 'slideshow'  
anywhere on that page.

There are 2 animated gif's but that to me is the only activity.
There is no apparent JavaScript in the source that would control a  
slideshow, and the CSS does not hint at any slideshow.



is there a reason for the spaces that you always seem to add to your links?


Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Menu items expanding with browser window

[Duncan Hill]

On Tue, 31 Aug 2010 22:43:45 +0100, Ellen Heitman  
 wrote:



Please take a look at the following test page:

http://www.pottersignal.com/sales_test.aspx

Notice that if you expand or contract the page the horizontal menu at the
top of the page expands and contracts with it. How can I fix this?

Also, please ignore the tabulated structure of the website overall. This  
is
an inherited project and I am working on transitioning to a semantic  
layout,
but that will take quite some time. Is there anyway to fix this issue  
now?


Thanks!


Your menu ul is quite happily doing its own thing in relation to the rest  
of the page, thanks to its absolute positioning.
It would seem to be perverse to attempt to manipulate the CSS by hacking  
at it considering that your intention is to rewrite the page to eliminate  
the tables.
A longer term, and probably faster solution might be to get rid of the  
'header' table now, and incorporate the menu into a more semantic  
xhtml/css solution.
A new header could be as simple as a div placed above the rest of the  
table areas, float your logo left, and the other two navs can be cleanly  
positioned to the right using simple css.
Rebuilding the header area should not interfere with your other tables -  
(much)
Out of topic range for this list, but your 'header table' does not end in  
the html where your comments say it should, this may be what has messed up  
your menu as it stands. Was the css positioning perhaps a hack to correct  
that error?


Duncan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Controlling image placement with CSS

[Duncan Hill]

On Tue, 17 Aug 2010 05:53:28 +0100, Keith Purtell  
 wrote:

> Well, the validator was a huge help. Two problems I ran into:
>
> 1- It did not like the way I imported my style sheet. I thought my tag
> 
> was correct, but the validator choked on both the @ and the ;
>
> 2-I tried just pasting in my link into the 'address' field at
> http://validator.w3.org/ and clicking on the 'check' button, but the
> result was incomprehensible.
>
> I'll fix the image and 'pindent' problems next, Chris Akins, it's almost
> midnight and I'm tired!
>
>
> - Keith Purtell

Change your import link to: