[css-d] New CSS book
Hi all. http://oreilly.com/catalog/9780980455229/?CMP=EMC-E2H238907668#top points to a book Everything You Know About CSS is Wrong! Has anyone seen this? Is this a ruse by Microsoft to get everyone to switch to IE8? Comments appreciated before I commit $30. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P, HauptwerkODFWriters groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] IE position problem
I have no issue with any of that below. It's factually correct. What has
happened is that some folks have read their own meaning into what I said, which
is that (apart from HTML the BODY is the prime and only global element at
the start of a document. If you simply add text to it, the text will obey any
settings that have been defined for 'body', including margins and padding. When
any other element is *added* within 'body' the situation *changes*. The text
within 'body' will still obey 'body' rules and anything else will set its own
rules and take over from 'body' and may or may not inherit attributes from
'body' and may or may not set its own attributes. That's a fundamental fact and
is the 'change' from 'body' attributes that I originally spoke of. I have never
mentioned 'inheritance' up until this message, so I don't know where that came
from.
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: Alyda Gilmore
To: Alan K Baker ; css-d
Sent: Friday, October 10, 2008 6:21 AM
Subject: Re: [css-d] IE position problem
The following is quoted from
http://meyerweb.com/eric/articles/webrev/199903.html
Not all properties are inherited, however. As an example, most of the box
properties (margins, padding, and borders) are not inherited.
To demonstrate this, I've uploaded two files to my server:
http://www.aroundtheblock.net/tutorials/css/index.php
http://www.aroundtheblock.net/tutorials/css/indexNoPM.php
The first page (index.php) has the following in it's stylesheet:
ul, ol, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, div, blockquote,
input, textarea, fieldset
{
margin: 0;
padding: 0;
}
For the second page (indexNoPM.php) I changed the above selector to include
only the body:
body
{
margin: 0;
padding: 0;
}
There's an obvious difference in the margin and/or padding of the p, h1, h2,
and ul elements on each page.
---
Alyda
__
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] IE position problem
This is simply absolutely true because the 'body' element is the global (and
only) element until you change something. i.e. Add another element into the
'body'.
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: Serge Krul
To: Alan K Baker
Cc: css-d
Sent: Friday, October 10, 2008 2:11 AM
Subject: Re: [css-d] IE position problem
Setting padding and margin to 0 in 'body' will globally remove all padding
and margins until you change the situation.
This is simply not true. body {padding:0; margin:0} will zero margin and
padding only on the body element. This is in no mean a global reset because the
padding and margin properties are not inherited. Read the spec:
http://www.w3.org/TR/CSS21/box.html#padding-properties
Serge Krul
__
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] IE position problem
Jennifer. Setting padding and margin to 0 in 'body' will globally remove all padding and margins until you change the situation. That is, if you do nothing else to padding or margins, they will never appear. As soon as you define a class or id and change its padding and/or margin, that definition will be obeyed within that class or id. Anything outside those definitions, that is in the body only, will obey the definition for the body. i.e. No padding/no margin. I hope this helps. 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: JGardner To: Serge Krul Cc: CSS List Sent: Tuesday, October 07, 2008 4:45 PM Subject: Re: [css-d] IE position problem Thank you! I do have a question though. I thought by setting the padding and margin to 0 in the body that it removed all margins through out the document. I am surmising from the fix you sent below that is not true. Can someone clear this up for me? Thank you, Jennifer JGardner Designs Creating your e-Presence www.JGardnerDesigns.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] CSS image question
Yes Lou, CSS can do this.
Simply make a box:
.boxname {
position:relative;
background-image:url(your 200px x 200px image filename and path);
background-position:-100px -100px;
width:50px;
height:50px;
overflow:hidden;
/* position, padding, margins etc to suit. */
}
to move to a different part of your big image, just change the background
position x y.
If you want to move your box to an absolute position then change
position:relative to position:absolute and add top:y; and left:x; where x and y
are your coordinates.
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: Lou Hernsen
To: css-d@lists.css-discuss.org
Sent: Monday, September 08, 2008 3:26 AM
Subject: [css-d] CSS image question
Hi.. I'm sorta new to css.. here is the question.
Lets say I only want to show a 50x50 px part of an image that is 200x200 on
a web page.
I want to show the area starting at 100x100y to 150x150y in a box 50x50...
can css do this?
or should I be looking at javascript?
What is the syntax for the command? and is the command used in the position
command?
thanks for your time and answer
Lou
__
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] Can't make table cell behave
Hi all. I'm rebuilding a site for a friend and I'm having a problem getting text aligned in a table cell. The page is at: http://www.webbwize.co.uk/Test_Area/OwenJones/stoplist.html and the stylesheet is at: http://www.webbwize.co.uk/Test_Area/OwenJones/stylesheet.css I want the first line of text in every td to be top aligned rather than as it is now, with a lot of white space where the content is less than the td with the most content. I've tried various CSS 'solutions' with no success. Perhaps I'm missing something fundamental. :-) The original at: http://theatreorgans.com/owenjones/stoplist.html aligns properly but is such a mess, has no styling and won't validate, I had to start again. There may be a better way of achieving the effect without the use of br /s using CSS alone and if someone can point out a solution, I'd be grateful. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Can't make table cell behave
- Original Message -
From: Ingo Chao
To: Alan K Baker
Cc: css-d
Sent: Sunday, August 31, 2008 6:30 PM
Subject: Re: [css-d] Can't make table cell behave
#stopbox table td { vertical-align:top; }
at least in Fx3
Ingo
--
http://www.satzansatz.de/css.html
http://www.dolphinsback.com
Hi Ingo.
You da man. grin
I thought I was missing something fundamental. Just needed it pointing out. :-)
I guess I just spend too long trying to get rid of tables and forget how to
actually use them.
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Any IE8 news?
Very brave. grin 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: Nancy To: [EMAIL PROTECTED] Cc: css-d@lists.css-discuss.org Sent: Thursday, August 28, 2008 7:22 AM Subject: Re: [css-d] Any IE8 news? Thanks! I'll install it tomorrow night. __ 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] CSS IE6 help
Christine. I have just looked at your page on two adjacent screens, one with IE6 and one with IE7 and they look identical. I didn't measure to the last pixel, but what the heck? It looks fine to me. I see no drop down. :-) 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: Christine Kilger To: css-d@lists.css-discuss.org Sent: Friday, August 22, 2008 3:47 PM Subject: [css-d] CSS IE6 help Hello, I am mostly a lurker on this group and need some help with a page I am on deadline with. On IE 6 the spotlight areas is dropping down.. __ 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] Awkward layout
Hi all. I have placed a pdf file at the following URL: http://www.webbwize.co.uk/Test_Area/ketron-dec06.pdf The first two pages show a layout that I wish to achieve. Obviously the top-left header is straightforward and could be put into a 1/2 width left column and I could have a 1/2 width right column for the other text. Try as I may, I can't get my head around putting images in the center so that the left and right column text flows around the image, as per the pdf file. I've been searching the Internet and so far have not found anyone demonstrating this type of layout. I'm not asking anyone to write my code for me, but if someone could give me some pointers to generally setting up a page like these, I'd be very grateful. I suspect I'm going to look stupid and someone will tell me that there are hundreds of such pages. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Awkward layout
- Original Message - From: Bill Brown To: Alan K Baker Cc: css-d Sent: Friday, August 22, 2008 9:15 AM Subject: Re: [css-d] Awkward layout Hi Alan! The technique you're seeking was covered in an A List Apart article in late 2004: http://www.alistapart.com/articles/crosscolumn/ ...and again in early 2005: http://alistapart.com/articles/crosscolumn2/ Sorry, I couldn't find hundreds of links, but these should help out. ;) --Bill P.S. I haven't forgotten about our email conversation from weeks ago, just been busy. I'll send you an update sometime soon. Hi Bill. Thanks for that. Two is fine - better than none. :-) Probably all I will need. Actually, a lot of it is obvious after you've read it, but it takes a clever person to point it out. Now off to try to incorporate some of the ideas. As and when for 'other stuff'. I guess we're all busy, but that must be better than being idle. g Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Way off-topic discussion [was: Forms]
Yes it is. It has a very loose connection with CSS and nothing to do with the original subject line Forms, whatsoever. I'm surprised that the List Moderator hasn't put a stop to it, or at least insisted that the subject line is changed. 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: James Leslie To: css-d Sent: Thursday, August 21, 2008 11:14 AM Subject: Re: [css-d] Forms ...I think this may be drifting off-topic here. __ 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] Browser market [was: Forms]
Can we please leave the title to this thread at anything but Forms. I started the Forms thread and am happy to receive replies to it under that title. I have no problem with the current arguments, but I don't want to join in this one and would rather not have to wade through it, because the title says I should. 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: david To: css-d Sent: Wednesday, August 20, 2008 8:36 PM Subject: Re: [css-d] Forms Lesley Binks wrote: Bobby Jack wrote: ... __ 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] Forms
I'm sorry, I should have said that I hadn't got round to testing in Firefox
yet. I only tested in IE7 for now. I tend to try to get it right in one browser
first, then tweak it later for the others and yes, the float:left *does* make a
difference in other browsers.
Thanks for the 'fix'. It certainly makes it all stand to attention and salute.
:-)
You're right about the h3s, they don't work properly. This appears to be
because the form is laid out in a strange fashion and try as I may, I can't
make anything stay inline after the form input fields. I have come up with a
really foul method of twin negative margins that will make the h3s do what I
want, but I'm far from happy about the method. It's just plain wrong, and I'm
not proud of it as a fix.
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: Thierry Koblentz
To: 'Alan K Baker' ; 'css-d'
Sent: Wednesday, August 13, 2008 5:58 PM
Subject: RE: [css-d] Forms
The overflow and zoom put the backgrounds and boxes in their correct
places, but the input {float:left} makes no difference. Those fields just stay
stuck together and won't align.
It makes a difference in Firefox. You were checking with IE, I was checking
your page in FF...
This is your page with the fix for IE (keep using float for other browsers):
http://tjkdesign.com/test/alan.asp
As a side note, I'm not sure about your use of h3s in there (Maximum x
characters) and you'll have to take care of these as they do not follow floats
in IE.
--
Regards,
Thierry | http://www.TJKDesign.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] Odd ?bug? in IE7
I was using IE7 today, with in excess of 10 tabs open. The last one happened to be where I was viewing the output from my edited code, on a dual screen. The css definition contains a reference to a 1 pixel png file that is repeated within a div in both x and y directions, to make a solid box. The png is literally 1px single colour solid with no transparency set. What I saw in IE7 was not what was expected. Instead of a solid box, it was rendering a graded box from dark to light. Very pretty, but wrong. :-) I checked my code and could find no error, then I checked an online version in an earlier tab and that was OK, so I downloaded that code and ran it in the tab that was showing wrongly, and the display was still incorrect. I closed down IE7 and re-started it and all was normal again. :-) Has anyone else ever come across this problem? It hasn't re-appeared, so I can't tell whether IE7 itself became corrupted. whether IE7 has a general problem when many multiple tabs are open or if there was a memory contention problem within the PC. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Forms
Hi Thierry.
I'm sorry, the '#' was a typo. I was using 'form' not #form' :-)
The overflow and zoom put the backgrounds and boxes in their correct places,
but the input {float:left} makes no difference. Those fields just stay stuck
together and won't align.
I have now made it work, but it's dirty. At least it validates. With use of
h3s and br /s in the HTML it lines up as it should, but I'm sure this
should be possible with CSS alone (apart from the h3s which are styled
anyway) not using br /s which implies that if someone else was writing the
HTML, they would be doing the formatting, which the CSS ought to be doing.
I've uploaded the code again if you fancy looking and are not getting too bored
with 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: Thierry Koblentz
To: 'Alan K Baker' ; 'css-d'
Sent: Wednesday, August 13, 2008 2:44 AM
Subject: RE: [css-d] Forms
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
discuss.org] On Behalf Of Alan K Baker
Sent: Tuesday, August 12, 2008 6:10 PM
To: css-d
Subject: Re: [css-d] Forms
Hi Thierry.
I set a float on #form input but it makes no difference.
If it didn't make any difference it is because you're using #form instead of
form (your form has no ID).
Adding the rules below to your CSS file should fix everything:
form {
overflow:hidden;
zoom:1;
}
input {float:left;}
--
Regards,
Thierry | http://www.TJKDesign.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] Forms
Hi Gang. I've set up a simple Form at: www.webbwize.co.uk/Test_Area/Register/ with a stylesheet at:www.webbwize.co.uk/Test_Area/Register/stylesheet.css I've tried all sorts of 'tricks' but can't seem to set up the styles that I want. The labelss all line up OK and have styling, but the input fields refuse to comply. In case there's any doubt, The labels are fine and right-aligned and each input field should be to the right of its label. Each input field should line up vertically with the one (that should be) below. I know there's insufficient styling applied to the input fields right now, but I've left the code as it was at my last attempt. Can someone please take a look and hopefully point me at an elegant solution. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Forms
Hi Thierry. I set a float on #form input but it makes no difference. You know it's amazing that a thing can stare you in the face and you don't see it until someone else points it out. I've removed all of the name tags. I hadn't noticed them! They were generated by Dreamweaver before I started to use the label tags for alignment and I forgot to remove them. :-) There is something strange occurring (certainly in IE7) where the top element is outside the colored Form background. I've also set a 1px solid black border on the 'form' and only some of the fields are being rendered within it. Strange that the two password boxes line up OK, but nothing else does. :-( The labels and fields are supposed to appear in exactly the same order as their definition in the HTML. I've reposted the files to my website. Any further ideas? 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: Thierry Koblentz To: 'Alan K Baker' ; 'css-d' Sent: Wednesday, August 13, 2008 12:09 AM Subject: RE: [css-d] Forms -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] discuss.org] On Behalf Of Alan K Baker Sent: Tuesday, August 12, 2008 3:21 PM To: css-d Subject: [css-d] Forms Hi Gang. I've set up a simple Form at: www.webbwize.co.uk/Test_Area/Register/ with a stylesheet at:www.webbwize.co.uk/Test_Area/Register/stylesheet.css I've tried all sorts of 'tricks' but can't seem to set up the styles that I want. The labelss all line up OK and have styling, but the input fields refuse to comply. In case there's any doubt, The labels are fine and right-aligned and each input field should be to the right of its label. Each input field should line up vertically with the one (that should be) below. I know there's insufficient styling applied to the input fields right now, but I've left the code as it was at my last attempt. Can someone please take a look and hopefully point me at an elegant solution. Hi Alan. I'd float the input fields too. As a side the attribute for is for id, not name. -- Regards, Thierry | http://www.TJKDesign.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] more vertical pop-out
- Original Message -
From: Alan Gresley
To: Alan K Baker
Cc: css-d@lists.css-discuss.org
Sent: Friday, August 08, 2008 5:57 AM
Subject: Re: [css-d] more vertical pop-out
That jumping and alignment issue can be fixed by changing this CSS.
#buttonframe li ul {
top:4px;
}
#buttonframe li a span {
top:1px;
}
#buttonframe li a:hover {
background-position:0 -116px;
}
to this.
#buttonframe li ul {
top:0;
}
#buttonframe li a span {
top:0;
}
#buttonframe li a:hover {
background-position:0 -115px;
}
All those small amount of pixels add up. :-)
--
Alan http://css-class.com/
You are of course 'spot-on'. :-)
I did play with moving things a pixel at a time, but didn't hit the 'magic
number' before giving up, figuring that Tony would sort that one out for
himself.
Actually I'm just plain lazy. g
I've amended the css in case Tony still wants to download it:
www.webbwize.co.uk/Test_Area/Somersetspiess/stylesheet.css
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] more vertical pop-out
Tony. I have separated your HTML and CSS because I find it easier to read and troubleshoot this way. I've put up a test page with your code, which I have modified. The html is at: http://www.webbwize.co.uk/Test_Area/Somersetspiess/ and the css is at http://www.webbwize.co.uk/Test_Area/Somersetspiess/stylesheet.css which you should be able to copy and use. You had some redundant declarations in the CSS and (if I have positioned the way I *think* you want it) I have corrected your positioning. ISTM that your buttonframe image set is not quite accurate, as there's a slight jump when navigating it, which cannot be corrected by moving the image up or down. It's *not* a browser bug, and it's only 1 pixel in each sub-image, so you may not care too much. :-) You also needed to set the sublist to 'hidden' and the ul to 'visible' to make the 'popout work. In your HTML you had your li ul constructs incorrectly nested. You must put the /li *after* the sublist. I've also set up an extra popout submenu for you, just to show that it will work for any of your primary lists. My modified code works in IE7, Firefox, Opera and Safari, but not in IE6. If you want it good for IE6, then it's a whole different ball game and will need some extra work. :-( Hope this helps and sorry it took a while, but I'm also busy on other stuff. :-) 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: tony To: css-d@lists.css-discuss.org Sent: Thursday, August 07, 2008 5:17 PM Subject: [css-d] more vertical pop-out Hi, Georg helped me sort out my vertical menu to achieve the effects I wanted. Would now like to refine it with a hidden pop-out on the 'Local Photos' menu, to show in a vertical stack on hover. In Gecko mode I managed to align horizontally But Couldn't get them to display on hover. I see in Explorer the sub-menu has gone vertical and off to bottom. As can be seen at www.somersetspiess.co.uk Can anyone please indicate the tweaks I need to implement? Yeah you guessed dead novice, but thanks in advance Tony __ 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] Dynamic Navigation Link Aid
Hi Stephen.
AFAIK there's no simple way around putting a common nav bar on every page,
other than by the use of Frames, which I wouldn't recommend.
It's a PITA when a client suddenly wants an extra 'button' added to the
navigation. :-(
I have this problem with nearly all of my websites, but at least with CSS you
only need write the style for the nav, once.
Instead of the li id=currenta href=#Link 1/a/li construct, I now
prefer to specifically style the 'current' mode as fixed, with the cursor
defined as default for the state and an image that the user can recognise as
specifically 'current'.
Something along the lines of:
div id=navbar
div id=current
ul
liCostumes/li
/ul
/div
ul
lia href=scenery.htmScenery/a/li
lia href=lighting.htmLighting/a/li
lia href=sound.htmSound/a/li
lia href=magic.htmMagic amp; FX/a/li
lia href=props.htmProps/a/li
lia href=memorabilia.htmMemorabilia/a/li
lia href=misc.htmMiscellaneous/a/li
lia href=../index.htmHome/a/li
/ul
/div
#navbar li a, #navbar #current li {
background-image:url(../images/SmBlankMulti.png);
position:relative;
background-position:0 0;
background-repeat: no-repeat;
cursor:pointer;
etc
}
.navbar li a:hover {
background-position:0 -28px;
}
.navbar li a:active, #navbar #current li {
background-position:0 -56px;
color:aqua;
}
#navbar #current li {
cursor:default;
color:aqua;
}
Hope this helps.
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: Stephen Carrell
To: css-d@lists.css-discuss.org
Sent: Tuesday, August 05, 2008 2:46 PM
Subject: [css-d] Dynamic Navigation Link Aid
Hi all,
I'm new to this forum and relatively new to CSS-based web design, so please
excuse my newb-ness over the following days/weeks/etc.
I'm trying to find a way to style the navigation links in a document that
will highlight the page that the user is on, and do it in such a way that I
don't have to hand-code every page. Thus far, I've used:
ul
li id=currenta href=#Link 1/a/li
lia href=page2.htmlLink 2/a/li
lia href=page3.htmlLink 3/a/li
lia href=page4.htmlLink 4/a/li
/ul
and styled #current to make the link stand out. It works, but there _has_ to
be a better way than doing this for every nav menu in every page in a
website.
Can anyone help me out? I'd appreciate it; thanks!
Regards,
Stephen Carrell
__
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] Fixed up Style sheets !!!
If you're going to self-indulge in such utter childishness, then it's unlikely you will get any help. :-( Or is this just another sneaky way of posting the same question twice? You really don't have to quote the entire body of the previous message, even if it's your own. 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: Christopher To: CSS Discuss Sent: Tuesday, July 29, 2008 3:42 AM Subject: Re: [css-d] Fixed up Style sheets !!! Oh, I forgot no more help for me I am the bad one __ 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] centering navigation tabs in a header section
Hi Kelly. Remove the float:left 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: Kelly Moore To: css-d@lists.css-discuss.org Sent: Thursday, July 10, 2008 11:42 PM Subject: [css-d] centering navigation tabs in a header section I'm trying to center navigation tabs, within a header section. Somehow the tabs are still stuck to the left. I'm using the following CSS: width: 600px; margin-left:auto; margin-right:auto; float:left; Any ideas of what i'm doing wrong? __ 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] Javascript: getElementsByTagName() getElementsById(): HowgetElementsByClass()?
This is a CSS ONLY forum! 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: abhishek khurana To: css-d@lists.css-discuss.org Sent: Monday, July 07, 2008 1:35 PM Subject: [css-d] Javascript: getElementsByTagName() getElementsById(): HowgetElementsByClass()? let me know u guys feedback on this: http://pitfalls.wordpress.com/2008/07/07/querying-it-jquery-way-getelementsbyclass/ __ 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] CSS Help: Changing Tab color on selected page?
BTW. You also have several instances of the same typo in your CSS. They read: background-color:ooaeef instead of 00aeef. 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: David Laakso To: Heidi Hackler Cc: Erik Fadiman ; css-d@lists.css-discuss.org Sent: Sunday, July 06, 2008 5:57 PM Subject: Re: [css-d] CSS Help: Changing Tab color on selected page? Heidi Hackler wrote: I would like the tab color on the page you are ON (selected page) to be a different color... __ 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 Please
It looks OK to me, if a little slow to load images, but that could just be the server. What else did you want to know? 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: Professional Web Pages - Information To: css-d@lists.css-discuss.org Sent: Friday, June 20, 2008 9:43 PM Subject: [css-d] Site Check Please To whom it may concern, Would you please provide feedback for the website http://www.AMSvet.com.au/ Thank you. Regards PWP __ 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] CSS Roll Over Problem Help
No, not necessarily. It depends on how many different blocks of three images
you need to use.
This method uses a single combined 3 image block for a vertical menu and works
cross-browser:
You'd need to set inline params for a horizontal menu.
It doesn't cater for sub-items, but once you have mastered this, it's a fairly
easy progression.
HTML:
div id=menu
ul
lia href=item1.htmlItem1/a/li
lia href=item2.htmlItem2/a/li
!-- and as many more or less li items as you need --
/ul
/div
-
CSS
#menu {
/* Create box/position for menu with a background image if required */
}
#menu ul {
/* Set position and padding/margins of ul within menu box */
}
#menu li { /* Remove li defaults */
list-style:none;
}
#menu li a {
background-image:url(3 part single image url goes here);
background-repeat: no-repeat;
background-position:0 0;
/* Set width, height etc */
}
#menu li a:hover {
background-position:0 -73px; /* Change position to suit image sizes */
}
#menu li a:active {
background-position:0 -146px; /* Change position to suit image sizes */
}
-
Just add appropriate sizes and positions to suit your images, and remove anchor
default coloring as necessary.
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: Christopher
To: css-d@lists.css-discuss.org
Sent: Saturday, June 21, 2008 1:49 AM
Subject: Re: [css-d] CSS Roll Over Problem Help
So I have one div now with just a background image. I have to create
three other divs ? And each one
being a :hover and a :active?
__
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] CSS Roll Over Problem Help
I think I see what you want. Forgive me if I'm wrong. :-)
Referring to the example I gave you in my last reply:
You need to define the screen position of your menu in #menu {}
Then define your actual menu element box sizes (width and height) to create a
box 'window' to view parts of your image using #menu li a {}
You would also define the coordinates of the first part of your image you want
to view in #menu li a {}
After that it's a simple matter of setting the coordinates for the part of your
image that you want to use for the rollover using #menu li a:hover {}
and again for the active part of the menu using #menu li a:active {}
The top and left coordinates of your image will be 0 0 and any other pixel
coordinates will be negative values taken from 0 0 as the initial reference.
If you need different parts of the image in each menu li item, then you would
need multiple divs, one for each different menu item.
It would be a lot easier if you could generate some code for this, even if it
doesn't work properly and put it on a site somewhere, along with your 'giant'
image, then we could do some real work on getting it right for you. Failing
that, post what you have (including your menu image) direct to my email address
and I'll try to create something for you to learn from. I won't actually do the
entire job for you, as I believe that the only way to learn is by making your
own mistakes and correcting them, with or without help.
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: Christopher
To: css-d@lists.css-discuss.org
Sent: Saturday, June 21, 2008 7:37 PM
Subject: Re: [css-d] CSS Roll Over Problem Help
I have one giant image with 3 areas specific for links, I don't want the
whole image just 3 specific areas of the giant image, when I read up on
sprites most of the examples were little buttons so how do I go about
doing it this way which I have laid out ?
Christopher
__
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] CSS Roll Over Problem Help
Christopher. I'm sorry, but a couple of us have attempted to accommodate you and have given you outline examples, along with requests for more information from you. Unfortunately, so far there has been no interaction from you. All you have managed to do is to re-word the same question several times and repeatedly ask it, without meaningful discussion. I do not have your 'giant' image file, so there is no possible way I can give you an example using it. Further, I don't have the time or the inclination to generate a large image by guesswork. I've pointed you to one of my websites where what you seem to want is working, along with some extra 'bells and whistles' and I've even invited you to send your file via email, but you have failed to do so. Does this large image file actually exist outside an abstract concept? The task is straightforward enough. You have a large graphic representation and you are looking at it through a small moveable aperture, defined by CSS. If you are really not understanding what is a fairly mundane and everyday CSS function, may I suggest that you purchase a basic course or a book on CSS fundamentals and thoroughly learn it, generate some 'proper' examples of your own, make mistakes (we all do) then submit your work to this forum for analysis and help in making it work. I've received some great help from learned folks on this forum and you can too, but you really have to do your own homework. :-) 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: Christopher To: Alan K Baker Sent: Sunday, June 22, 2008 12:18 AM Subject: Re: [css-d] CSS Roll Over Problem Help Hi, well could you show me a example cause, I'm trying to wrap my head around this as it is, hopefully you have a example? __ 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] CSS Roll Over Problem Help
Probably because you need to set the nav up as a UL
and declare #menu li a
#menu li a:hover
#menu li a:active
Take a look at www.virtualtheatreorgans.com
All of the nav tabs are inline rollovers using a combined 3 image .jpg
CSS is at: www.virtualtheatreorgans.com/scripts/stylesheet.css
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: Christopher
To: css-d@lists.css-discuss.org
Sent: Friday, June 20, 2008 12:22 PM
Subject: [css-d] CSS Roll Over Problem Help
Hi, I have my div called navigation then I have navigation:hover but
this does not work ? I know I'm missing a step could it be a link cause
the graphic needs to be one big graphic BUT specific areas on the
graphic will have links to other pages NOT the whole graphic:
#menu a {
background: url(button.gif) 0 0 no-repeat;
...
}
#menu a:hover {
background-position: -157px 0;
...
}
#menu a:active {
background-position: -314px 0;
...
}
...with all 3 states in one big graphic.
__
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] extra right padding/margin in IE6
Are you re-working the site or are you constructing it? If you're re-working it, maybe you didn't get as far as removing or converting stuff, but if you're constructing it, might I suggest that you dump the tables and the JavaScript and construct it entirely with HTML and CSS. Your menus will be much more controllable with lists defined by CSS and it will be much easier to sort out the expanding box issues. You have referenced a stylesheet for IE6 by a conditional in your HTML header, but you have a space between IE and 6, so the condition will not be met. Also, I can't find StyleSheetIE6.css on your site, to see if it would have corrected your expanding boxes. BTW one more thing, you have spelled Transitions incorrectly in your Fathertime News/New site launched column. You have an 's' instead of a 't'. 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: Andrew Gaffney To: css-d@lists.css-discuss.org Sent: Wednesday, June 18, 2008 11:37 PM Subject: [css-d] extra right padding/margin in IE6 I've got a weird issue with a site that I'm working on. URL: http://www.fathertime.com/dev/ CSS: http://www.fathertime.com/dev/StyleSheet.css I've got DIVs that are a specific width with specific padding/margin and a background image (the Auctions, Contact Us, and Your Account boxes). In Firefox 3 and IE7, these DIVs are exactly as they're specified. In IE6, it's a different story. The boxes extend 10px or so farther to the right than they're supposed to. You can see it on the right when you compare the Your Account box and the Sponsored Ads box. Both are supposed to be 162px. __ 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] Email Virus
It's not for me to say on this forum what's right and wrong, but IMO it's very much off-topic and should be dealt with privately. If you really feel that this forum's at fault, may I suggest taking it up with the List Administrator. However, it's almost certain that the forum itself is not generating 'bad' messages. Now to go against my own comment. Nobody else seems to be getting 'bad' messages from this forum. My emails are heavily filtered, but I will always get a report if anything's amiss, and I have not had even one bad one. :-) You do have adequate anti-virus software don't you? g Feel free to email me privately if I can help. 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: Christopher Douris To: Terri Houston ; css-d@lists.css-discuss.org Sent: Tuesday, June 17, 2008 7:59 AM Subject: Re: [css-d] Email Virus I checked (and deleted) my e-mail after work and went to bed at 9:30 am Monday morning. When I got up at 3:30 pm I had more than 800 undeliverable or returned mail messages that had accumulated in my inbox--most with attachments in the original. Up until this, the most I would see is 30 or so messages. Is this situation related? Christopher - Christopher Douris Newmarket, Ontario [EMAIL PROTECTED] - - Original Message From: Terri Houston [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Tuesday, June 17, 2008 12:50:14 AM Subject: [css-d] Email Virus This is kinda off topic, but very important. I'm getting email viruses, and I think it's from this forum. An attachment is with every email I get. Of course, I haven't opened any of them. Anyone else with this problem. Anyone know how to stop this? Please do not remove this email, everyone needs to see it. Terri __ 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] Image caption width
- Original Message - From: Tracey Adams To: css-d@lists.css-discuss.org Sent: Monday, June 02, 2008 8:54 PM Subject: [css-d] Image caption width I am having a problem with keeping the captions under images to the width of the image and not all the way across the page. I've tried a number of things and the only thing I've found that sort of works is to set a width limit in my caption css. Of course that has only limited success. My images cannot practically be all the same width. For awhile I was making css image boxes in different widths but that got ridiculous... Not such a bad thing especially if IE6 will be used a lot and you have many/large images. I was having a lot of problems with IE6 'timing out' on sometimes slow connection speeds, due to the use of a lot of images. This was totally cured by defining the size of each image as a class in the CSS, so that the browser doesn't have to calculate it from the image file. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Submit Button Rollover in IE6
All of my literature says that IE6 won't recognise a rollover outside an anchor. Sad but true. I never made it work and don't even try any more, :-( Looks like you're stuck with the a tag. 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: Mark Wheeler To: CSS-D List Sent: Thursday, May 29, 2008 1:24 PM Subject: [css-d] Submit Button Rollover in IE6 Hi, I have been using the following for my submit button rollover. This works, obviously, in IE7, FF, Safari, etc. But, is there a way to get rollovers on submit buttons in IE6, or should I forgo the submit button and just use a regular a tag to submit the form? Any suggestions would be appreciated. __ 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] relative positioning
According to my books position:relative is to give a point of reference to any
absolute positioned elements inside it. That's always been my understanding and
it's always worked.
CSS The Missing Manual says: Relative - A relatively placed element is placed
relative to its current position in the HTML flow. So for example, setting a
top value of 20px and a left value of 200px on a relatively positioned headline
moves the headline 20px down and 200px to the left from wherever it would
normally appear.
So if you've set a position say top and left the div will move, but
position:relative is not the reason, it's set for the benefit of other elements.
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: Rick Pasotto
To: css-d@lists.css-discuss.org
Sent: Wednesday, May 28, 2008 9:08 PM
Subject: [css-d] relative positioning
Is my understanding correct that putting:
div#name1 { position: relative; }
in the css file should have absolutely no effect on div id=name1?
If that is correct, why then does IE6 move the div? Does it make a
difference that the block I'm dealing with is a fieldset?
__
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] Online vs. Local and ID vs. Class weirdnesses?
Absolutely. Drove me nuts for a while. :-) I don't know if any other browsers do it, as I've not had a problems so far, but IE6 was my culprit. I did not explicitly define the sizes of images, leaving the browser to work them out for itself. According to Georg Sørtun, IE6 can't cope, especially with large images and gives up its size calculation part way through, with disastrous results. I don't think I ever saw it happen locally, but online it would depend on the time of day (number of DSL users) and the connection speed, so it was variable in effect, and I was getting intermittent complaints from my client. The solution - declare all image widths and heights. In my case, instant cure. 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: Melton Cartes To: css-d@lists.css-discuss.org Sent: Sunday, May 18, 2008 4:10 AM Subject: [css-d] Online vs. Local and ID vs. Class weirdnesses? Has anyone experienced any of the following? Layout problems or works doesn't work depending on if you're looking at the site online (uploaded and refreshed) as opposed to looking at it locally (from your hard drive) or via the internet but through your public folder? And... Styles working for classes but not IDs? Why? mc __ 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] Image displacement
Hi all. Another couple of problems that are driving me insane once more. g I am using image (background) displacement to simulate the movement of a 'switch tab' on a pipe organ. Each image category (there are four) is a .png compiled from three separate images placed one above the other in a vertical line. The initial images are correctly positioned and the a:hover state works fine too. However, the a:active state is acting strangely in all browsers tested so far. What should happen is that in the a:active state the last (lowest) part of the image starting at 250px from the top of the image, should be placed in the containing div at 0 0, which it does, but it appears to be wrapping vertically so that 11px of the image below 250px appears at the bottom of the div, where there should be nothing. I can't see why this should be a placement problem and wonder if it's to do with the way z-index is handled, or is it because I have misunderstood the way that transparent images are supposed to be rendered when displaced within a set size div? The other problem is that at the bottom of each 'tab' image there is a figure and under that a three letter abbreviation. So that they can be styled and placed precisely, I've given each a separate definition, but they are defined in the HTML as spans because a href rules won't allow a div to be used. They are not picked up by the anchor state in IE, consequently they cannot be picked up by the parent div's a:active state, so I can't change their characteristics (text size etc) to follow the background image appearing to be smaller, when the mouse is clicked. The correct effect can be seen on the top text for each image, which is working correctly as expected. Can anyone think of a way of achieving this with text, as I don't want to have to resort to further graphical text manipulation? I've uploaded the site to: http://www.webbwize.co.uk/Test_Area/VTPO/ the stylesheet is at: http://www.webbwize.co.uk/Test_Area/VTPO/scripts/stylesheet.css and relevant images are in: http://www.webbwize.co.uk/Test_Area/VTPO/images and subfolders. I know that there are further problems with IE6, but I'll address those later. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Image displacement
- Original Message -
From: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Sunday, May 18, 2008 2:11 PM
Subject: Re: [css-d] Image displacement
Alan K Baker wrote:
http://www.webbwize.co.uk/Test_Area/VTPO/
The addition of...
.couplertab li a, .fluetab li a, .reedtab li a, .stringtab li a {
background-repeat: no-repeat;
}
...will fix the problem with the shorter background.
Absolutely on the nose, Georg. I do feel silly for missing that one, but then
it's obvious after it's been pointed out. :-)
[...] The correct effect can be seen on the top text for each image, which
is working correctly as expected.
Except that small font-sizes do not survive 'minimum font size' or 'ignore
font size'.
Agreed, but then how far do you go to accomodate everyone? My main criteria is
to have the text fit the tabs and have the entire presentation look like the
'real thing', to those 'in the know'.
Can anyone think of a way of achieving this with text, as I don't want to
have to resort to further graphical text manipulation?
Address them as...
#navbar li a:active span { /* and style to your liking */ }
Thanks for that Georg. Something I needed to learn. :-)
Delete the 'z-index: 200;' on '.abbreviate, .pitch' while you're at it, as it
serves no purpose.
One that got 'left-over' when moving things around, it will be banished. g
Additional comments:
The whole construction makes me wonder why there are so many DIVs and ULs in
there, as one UL and a number of LIs with anchors would work just fine.
As with many of my 'projects', I'm always in a hurry to meet a deadline and
panic myself into taking the easy option, then maybe clean up afterwards. This
one has several 100Mb of music files for users to download, and I took the
files on because the forum-server that they are on, is almost full, so needs
emptying ASAP. This one's my own pet project, so it's only me to blame.
All backgrounds with all states can be contained in one image, and horizontal
background-offset be used to line them up as what you have now. Will make the
whole thing less complicated I think, and one image loads faster. You can
also tune the image a bit and make it 8bit png, which will make IE6 more
cooperative.
That sounds like a good idea and one I will consider as soon as the site is
actually 'live'. I presume that you are suggesting that each li is given a
style appropriate to its background image position. It's a nice solution, and
one that I am now keen to implement.
There may be one complication in that (if you've ever seen one of these
instruments) the console is shaped like a horseshoe, and the backboard which
contains all of the tabs is semi-circular, which means that the tabs nearer the
left and right sides are turned inwards by varying degrees. I'm aiming at
future expansion which would mean many more tabs, and as with the real thing,
they simply won't fit in a straight line in the available space. Although it's
straightforward enough to rotate the images, as they will still be in
straight-sided containers, it may prove quite difficult to make the 'squares'
overlap, using lis alone. Further comments appreciated.
Remember that IE6 'auto-expands' empty elements, as IE/win sees imaginary
spaces in empty elements. Declaring 'overflow: hidden' on them or simply
placing an HTML comment as only content inside them, will make IE6 stop
expanding them.
Will do. Again Georg, thanks for your sage advice.
regards
Georg
--
http://www.gunlaug.no
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Image displacement
Tedd. Granted that your map is quite an inspiration and as you imply, it's complex. However, I do believe that I may still have an equally difficult task ahead, not just due to partially rotated images, but also due to rotated text. Now that is going to be awkward without resorting to text images. g I do believe that you are right and that all can be achieved just with the use of CSS. A little lateral thinking perhaps? :-) 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: tedd To: css-d Sent: Sunday, May 18, 2008 3:38 PM Subject: Re: [css-d] Image displacement Alan: These are only images. They can be arranged any way you want with rollovers anywhere you want. Your semi-circular tabs are quite simple as compared to this: http://webbytedd.com/bbb/map/ You see, all of what you described can be accomplished with css. Everything you need to do is illustrated in this link. Cheers, tedd __ 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] float left causing border to break - help
Looks like you fixed it? g 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: Scott Thigpen To: css-d Sent: Sunday, May 18, 2008 1:11 AM Subject: [css-d] float left causing border to break - help I'm going to keep pounding at this and may get it to work (so if the picture and text are inside the box, you'll know I found success). Thanks! Scott __ 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] problems with css/javascript
Oops. Sorry Steve. I just realised that I made a mistake in my example, and forgot to 'close' the h3. You may have worked that out for yourself, but being new to website layout, here it is in case you haven't: (HTML) div class=thisclassforh3h3Some stuff here/h3/div 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: Alan K Baker To: css-d ; Stephen Davis Sent: Thursday, May 08, 2008 4:10 AM Subject: Re: [css-d] problems with css/javascript (HTML) div class=thisclassforh3h3Some stuff here/div.. __ 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] stylesheets for clock
You are of course quite correct, .clockface does exist, 'fraid I missed the
relevant stylesheet. :-)
Having looked at it, I suggest a small alteration which will make it easier in
the future for you to float elements next to it and you'd be able to get rid of
the table, which is irrelevant, and position your link and button images more
elegantly and accurately.
div.clockface {position:relative;width:100px;height:100px; z-index: 1;}
defines width and height for the clockface and stops the div from spreading
across the entire page.
There's an odd thing about the clock in IE6 and 7 in that the clock actually
does work OK, but the top (CSS) validator link image is missing. Firefox
displays the images correctly, but of course the clock doesn't update. I
haven't had time to look, but the image thing is probably just some positioning
and overflow management.
I've a suspicion that the clock not working is a Javascript problem, not CSS,
so I'm afraid it can't be covered on this forum, and I'm not sufficiently
JavaScript savvy to help you privately.
I agree about the bigger downloads for each page, but although they may
validate, frames are not recommended.
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: Stephen Davis
To: css-d@lists.css-discuss.org
Sent: Thursday, May 08, 2008 12:07 PM
Subject: [css-d] stylesheets for clock
Thanks Alan
The style does exist for clockface in stylesheetButtons.css. It is
div.clockface {position:relative; z-index: 1;}
I intend to remove frames in the future, and use two divs one for the header
and a scrolling one for the body. This will of course make downloads bigger but
instead of having buttons as links I will be able to have drop down targets for
headings in the page..
__
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] Could browsers miss CSS declarations?
See my posts over the last day or so. I'm sure that Georg will back me on this one. IE6 can do strange things with images and there's no reason to suppose that it can't mis-render backgrounds for the same reason. If it has to calculate the width and height of a rendered area, and there is any form of network congestion, then IE6 will 'timeout', just give up calculating, and render at whatever size its calculations got to when it 'gave up'! This could easily be a width and height of zero, which would have the effect of 'no display' for the element. This accounts for why I was obtaining perfect results with IE6 using local files, but when online, it would intermittently mis-render, even though the file paths were perfect, due to a slightly slow connection. The solution to my problem was relatively straightforward as I am using jpegs and I now specifically declare image sizes instead of leaving it to IE6 to calculate them. My client has reported no further problems. That's a solution for me, but may not be suitable for others, apart from triggering a train of thought. :-) You may well be correct and it is a 'has layout' issue. The whole point of my reply is to prove that IE6 CAN part render, distort, or both, but not because it missed the CSS! 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: david To: css-d Sent: Wednesday, May 07, 2008 10:19 AM Subject: Re: [css-d] Could browsers miss CSS declarations? A thought crossed my mind. Given IE6's dependence on the HasLayout bug, would it be possible for it to not render things correctly until something triggers hasLayout and makes IE render the area in dispute correctly? -- David [EMAIL PROTECTED] authenticity, honesty, community __ 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] problems with css/javascript
Your code was a bit difficult to download and follow, due to your use of
frames. You might consider using a no-frames construct using CSS only, to
obtain the same effect. Not only would it be in line with current thinking, it
would make it more accessible to search engines. an example of a frame
conversion can be found at: www.thatsentertainmentproductions.co.uk and the
style sheet is at:
www.thatsentertainmentproductions.co.uk/scripts/stylesheet.css
What I've found so far is as follows:
I notice that in: http://arithmetic.890m.com you use the line: h3
align=center font color=black..
where you would be far better defining the style for h3 in your stylesheet,
either in a global definition for h3 or in a div h3
e.g.
(CSS)
.thisclassforh3 h3 {
color:black;
text-align:center;
}
(HTML)
div class=thisclassforh3h3Some stuff here/div
Current thinking removes styling and positioning from HTML and puts it where it
belongs- in CSS. This of course won't cure your clock problem. :-)
In http://arithmetic.890m.com you have not closed the line: frame
class=buttons src=ButtonsPage.htm name=buttons id=buttons/ properly.
For XHTML 1.0 Transitional, there should be a space before the last / e.g.
frame class=buttons src=ButtonsPage.htm name=buttons id=buttons /
although this is probably not enough to 'stop the clock'. :-)
Your clock problem is probably due to a lack of interaction between JavaScript
and CSS, so fortunately it's on topic for this forum. :-)
In ButtonsPage.htm you have a chunk starting:
body onload=Timer(z,position)
div class=clockface .
but you have not defined the class .clockface in your stylesheet. This is
possibly what the JavaScript doesn't like. Why Opera performs, I don't know.
Perhaps it's just slightly more tolerant of missing classes?
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: Stephen Davis
To: css-d@lists.css-discuss.org
Sent: Wednesday, May 07, 2008 8:44 PM
Subject: [css-d] problems with css/javascript
I'm new to web page design; my clock doesn't work in firefox/safari but does
in IE7 and Opera. I know it's probably a typo error but why then does it work
in Opera.
http://arithmetic.890m.com
Regards
Steve Davis
__
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] : CSS Code Readibility ::
This is one of those 'Horses for Courses' arguments. Having been a programmer in machine code which had to fit onto 1K (yes 1K !!!) ROMs, I've been used to byte fighting and I've seen so called code optimisers, which have never been as good as the human hand. These days, life's much easier, but unfortunately, space-wasting has led to bloatware. You have to consider what the end result is to be. Is your code likely to be downloaded by folks on slow dial-up? How much code have you generated and what is the actual file size? What is the ratio of image files to text, on the site in question? Does it really matter if your visitors have to wait for a page to load? To answer that question, I cite the example of what has happened on my latest project over the last day or so. I was having problems with IE6 not always displaying large images and after discussion with Georg, I decided that it was a timeout problem due to IE6 taking too long to calculate sizes. I then defined all of the sizes for some 50 or so jpegs into the CSS, which increased the file size somewhat. It had the desired effect and instead of the increased CSS slowing things down, the benefits were remarkable. (Thanks Georg). If the site is proliferated by image files then cutting down the text (white space) will not make a significant difference and because most CSS files are relatively small in size, I don't really believe white space removal is worth the bother. You can of course use TABs to do your code formatting, which will reduce the byte count somewhat, or use an optimiser after you've finished writing your code, or one that runs on the server side. TBQH If someone asks for help on this forum and their code is sloppily formatted or compressed, I find that disrespectful to the person being asked for help, and if I'm tight for time, I would think twice before trying to read it. My vote's with 'Smashing'. :-) 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: Amrinder To: CSS Discuss Sent: Tuesday, May 06, 2008 2:48 PM Subject: [css-d] :: CSS Code Readibility :: l in size Hi, I was reading this article on Smashing Magazine which shows how to increase code readability, http://www.smashingmagazine.com/2008/05/02/improving-code-readability-with-css-styleguides/ but I have listened to Andy Clarke over Lynda.com saying that one should save the white space as it increases the file size. Which approach is better? Should we go for code readability as described by Smashing Magazine or follow what Andy said. Thanks, Amrinder Freelance Web-Standard Designer www.awayback.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] Disappearing images and min-height
Hi all. I have a recurring problem only with IE6, where the page is required to display a large image with a border. Unfortunately, the fault is intermittent. What sometimes happens is that the image is displayed very 'squashed' both vertically and horizontally and looks distorted. Sometimes refreshing the browser will correct the problem, other times it takes several refreshes and other times it refuses to comply. It's not just my stand-alone IE6 as my client reports the problem as well. Also, the problem is most apparent online and rarely occurs with my local files. It may not be my CSS, but if it is, I'd obviously like to correct it. The live site can be found at: www.northpiertheatreblackpool.co.uk select any of the 'Shows' pages - the home page has never given trouble. The CSS is at: www.northpiertheatreblackpool.co.uk/scripts/stylesheet.css and there's another www.northpiertheatreblackpool.co.uk/scripts/styleie6.css but that one does not affect anything to do with image sizing on IE6. Please ignore the non-working pop-up/down 'The Shows' hover menu in IE6. I'm going to totally re-write it to work properly and to allow the pages to validate. I have another problem with the same pages in Firefox, Opera and Safari where box height (auto) seems to be ignored. #main is the main content box with an all-round border and a min-height of 700px. When content exceeds that height in IE6/7 the box expands and the borders re-draw to compensate, pushing the bottom nav-bar down as I intended. Unfortunately, with the other browsers, depending on the content, mostly content that exceeds a height of 700px just drops out of the bottom and covers the bottom border and nav-bar. I'm sure I've missed something, but after an absolute deadline race to get the site live before launch, my brain hurts. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Submenu vertical position in IE7
Setting:
ul.MenuBarVertical ul
{
margin: 0 0 0 95%;
}
which will make margin-top:0 should fix it.
I didn't go any further down the menu tree, but you may have to set further sub
uls to margin-top:0 in the same way.
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: Stan McCoy
To: css-d@lists.css-discuss.org
Sent: Monday, May 05, 2008 5:49 PM
Subject: [css-d] Submenu vertical position in IE7
I¹ve tried to implement a Spry Menu from DW3 and have had no help from their
discussion group to solve this problem. It works well in Safari and FF, but
not in IE7.
The submenu on the sample page below is aligned with the top of the parent
menu instead of next to it's parent item in the main menu (Item
3)
Thanks for your help,
Stan
__
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] 3 column layout but fixed width center div w/ variable width left and right divs
I'm with you on that one, Georg. I wish all of my projects could be that easy. :-) Dump the tables and do it all with CSS and I don't think you'll have much grief. 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: Gunlaug Sørtun To: Michael B Allen Cc: css-d@lists.css-discuss.org Sent: Monday, May 05, 2008 5:49 PM Subject: Re: [css-d] 3 column layout but fixed width center div w/ variable width left and right divs Michael B Allen wrote: I want to create a layout like this site (which uses tables): http://www.ioplex.com/ The important part is the horizontal colored areas that span the entire page. Pardon my ignorance, but what do you need 3 columns for? The example is a single, centered, column with a bit of decoration spanning the entire body-width for the menu at the top - complicated by an HTML table. 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] Disappearing images and min-height
Since the latest discussion with Georg, I believe that what you suggest would probably work. If that's the case, then I guess I need to put the widths and heights explicitly into the CSS for each image. I'll look through the sizes for each image and see if I can find a commonality, then perhaps I can get it down to just a few defs such as .imgtall, .imgmed and .imgshort with maybe a fourth def if .imagdownrightawkward ROTFL. 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: David Laakso To: Alan K Baker Cc: css-d Sent: Monday, May 05, 2008 4:46 PM Subject: Re: [css-d] Disappearing images and min-height Alan K Baker wrote: I have a recurring problem only with IE6, where the page is required to display a large image with a border. www.northpiertheatreblackpool.co.uk Alan. Put the image height and width in the html and see if it resolves the problem. -- 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] Disappearing images and min-height
Georg, thank you for a well reasoned discussion.
I was beginning to wonder whether connection speed might have something to do
with image rendering, and you've just confirmed my suspicions. It's a crazy
world out there, where images may render correctly or not, depending on the
time of day and the number of DSL users! :-)
OK, it looks as if I will have to 'bite the bullet' and define a size in a
separately named div for each image. IE6 won't go away and the images will
always be of varying size, so I will have to stop being lazy. :-)
As far as expanding #main is concerned, I tried your suggestion and it does
indeed afford a great improvement, but unfortunately it's not quite perfect -
yet. :-)
I just realised that the images themselves - #imgl and #imgr were not floats,
so I've set them to be so and they now obey the top and bottom margins.
Now #main does expand to contain the images, but it is ignoring .imgcentered
{top-margin: 50px}. I guess that's because .imgcentered is not a float and has
left and right margins set to auto. Also, on the 'Events Diary' the browsers
(not IE) now chop the bottom of the table. I wonder if the same fix will cure
both problems? I guess I need to do some work on re-formatting the table defs.
Still, nearly there. If I can only sort out that dang pop-up/down menu block in
IE6, I can teak a break. g
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: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Monday, May 05, 2008 4:44 PM
Subject: Re: [css-d] Disappearing images and min-height
Alan K Baker wrote:
I have a recurring problem only with IE6, where the page is required
to display a large image with a border. Unfortunately, the fault is
intermittent. What sometimes happens is that the image is displayed
very 'squashed' both vertically and horizontally and looks
distorted.
IE6 (and older) can't auto-size images reliably. Locally all images will
be loaded so fast that there won't be a problem, but IE6 will time out
on most connections, and the more images IE6 has to handle the more
it'll mess up.
There's no real cure other than to force a re-rendering _after_ loading
is completed. A script can probably handle that ... or you can tell
visitors to try to resize text (even though you've used a fixed font-size).
Since auto means intrinsic size in your case, you can just delete
auto and let IE6 try to detect the real image-size.
Adding real width/height values for each image in the markup, will of
course work best.
I have another problem with the same pages in Firefox, Opera and
Safari where box height (auto) seems to be ignored.
Make #main expand to contain floats by adding...
#main {
overflow: hidden;
}
...and those browsers will behave as intended.
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] Off Topic [was: bodybg]
And this has precisely what to do with a CSS discussion list?
Hardly the place for any 'boss' to bawl out his employee.
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: Tommy D. Dorsey, Jr.
To: css-d@lists.css-discuss.org
Sent: Monday, May 05, 2008 7:09 PM
Subject: Re: [css-d] bodybg
This problem has been resolved. It seems Vance figured it out on his own,
but only after posting his rather offensive description of it.
However, there IS a problem with the way Vance described the problem and the
job, and the customer. The customer actually did not have ANY contact with
Vance. I am the boss that rarely gives him instructions, but when I do I
expect him to keep his mouth shut and follow them. In this case he followed
them but for some reason felt he needed to belittle the customer And his
boss in this forum. Unfortunately that customer somehow Google'd her website
and found Vance's post below.
The junk the customer presented (to me NOT Vance) was the actual content
for the web site. word for word. Better than most people present to us. Most
people just come in and say I need a web site and we have to take notes,
because they don't have ANYTHING written down. This lady had EVERYTHING
written down. I thought it was rather nice. Apparently Vance likes to be
more in control of the content...
Now this 'cheap job' as Vance so eloquently put it, has become expensive.
This customer of 10 years is now looking at other options.
Lesson: Please post your problems and NOT your opinions of your customers.
You MIGHT lose your job over it.
Tommy D. Dorsey, Jr. [EMAIL PROTECTED]
Technical Administrator
Cybergate, Inc. http://www.c-gate.net
From: Vance Lowe [EMAIL PROTECTED]
Sent: Thursday, April 24, 2008 10:36 AM
To: 'css-d'
Subject: bodybg
Alright heres my problem.
My boss comes in and says hey a lady wants a one page site. shes been and
ISP customer of ours for years so we are going to make an exception for her
and do it.
I give the weird look but say okay anyway since my boss gave me an
instruction. which is rare.
She comes in and for content, she hands me a pile of junk for content.
www.southmsmonitoring.com http://www.southmsmonitoring.com/
My problem is. I need that background image to stick to the bottom no matter
the size of the content and the window.
Much to my surprise. its behaving as I would expect in IE but firefox is
not.
Anybody know what the fix is? I hate beating my head against the desk over
a cheap job like this.
Vance Lowe
Web Designer
Cybergate, Inc.
www.cybergatedesigns.com
601-649-1564
__
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] Gif and PNG with IE6
There have been many messages. I suggest that you firstly check your spam filter. GIFs and PNGs can be used in IE6 but don't use a PNG with transparency set, or the transparency will display as white. If you're not seeing GIFs in IE6, it's doubtful that the GIF or IE6 are at fault, you need to carefully check your code. Why not post a URL so that the code can be inspected? 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: Wade Smart To: css discuss Cc: [EMAIL PROTECTED] Sent: Tuesday, May 06, 2008 1:34 AM Subject: [css-d] Gif and PNG with IE6 20080505 19174 GMT-6 Did this list all of the sudden get very quiet? I havent received a message for many days now. Anyway, Im using a background image on a page. One is a gif and the other a png. Neither are showing in IE6. As I did not use IE Im not sure what would be the problem. Was it not able to show gif and png? Surely it was. Wade __ 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] Inline elements
Hi all. I've included a short piece of code which does not do what I want.
Obviously removing the display:inline will display the boxes, but then
they're not on a horizontal plane any more.
I'm trying to create a horizontal bar with four equally space (horizontally)
boxes within it, but each box must be at a different vertical position from the
one next to it, within the stripe.
I realise that I can use images to get the boxes to 'appear', but due to the
restrictions of inline elements, I can't position the boxes vertically with
margins.
Does anyone have an elegant solution to this? So far I've only made it work
with absolutes.
-
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
titleUntitled Document/title
style
#container {
position:relative;
background-color:#ffdf79;
width:1000px;
height:auto;
padding:0;
margin:0 auto 0 auto;
}
#bar {
position:relative;
background-color:red;
width:660px;
height:119px;
padding:0;
margin-left:170px;
float:left;
}
.boxup, .boxdown {
display:inline;
width:80px;
height:80px;
border:none;
padding:0;
margin-left:70px;
}
.boxup {
margin-top:15px;
background-color:green;
}
.boxdown {
margin-top:25px;
background-color:blue;
}
/style
/head
body
div id=container
div id=bar
div class=boxup/div
div class=boxdown/div
div class=boxup/div
div class=boxdown/div
/div
/div
/body
/html
---
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Banner Font to big (Take 2)
Looks good to me now. :-) 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: Hayden's Harness Attachment To: Alan K Baker Sent: Tuesday, April 29, 2008 8:58 PM Subject: Re: [css-d] Banner Font to big (Take 2) Alan I have switched to 2.5em and changed the background color. HTML http://www.choroideremia.org/crf_header.php CSS http://www.choroideremia.org/css/crf_css1.css Angus MacKinnon Infoforce Services http://www.infoforce-services.com Faith is the strength by which a shattered world shall emerge into the light. - Helen Keller __ 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] Safari nested UL that is position: absolute invisible.
I don't know if this is a general browser bug, but I think you may have given me a clue to a rat of a problem I've been having with IE6. I used a nested ul for a pop-up navbar supplied by Hilco Tim, which uses a table for IE6 only, and the dang thing refuses to work for me, yet his example is OK. It looks likely that this is being caused by an overflow problem too. I set a colored border round the nested ul and removed the :hidden attribute from the hover and I can see that all is there, but once hidden, the little s**t refuses to come out of hiding. g I may try to resolve this as I have a deadline, but ultimately I will change the listing method, because Hilco's one does not validate, due to the table being within an anchor in the IE6 conditional. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus Agh i figured this out. The td element that was containing the #nav had an overflow: hidden; with a set width. I thought if i positioned an element absolutely that it doesn't get affected by overflow: hidden; from a higher level container? Is that not true? Is this a Safari bug? __ 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] Egg timer flicker in ie6 on hover
Dermot. I'm sorry I didn't get round to answering your previous comment and I'm really pleased to see that you have a fix from Mark. I had previously Googled for an answer as well, but obviously didn't choose the right keywords. :-( What's a bit strange is that the problem that you had with flicker wasn't nearly so apparent as it is in the example given in the 'fix' article, and even applying the 'fix' I still get the egg-timer, but very briefly. In fact I don't think most users would complain about it, as it's so short in time. Perhaps we are searching for two different bug fixes? It would be good if we could find a CSS only fix. 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: Dermot Ward To: css-d@lists.css-discuss.org Sent: Monday, April 28, 2008 8:17 AM Subject: [css-d] Egg timer flicker in ie6 on hover Very many thanks Mark for your reply Really appreciated. Excellent article. Excellent fix. http://evil.che.lu/2006/9/25/no-more-ie6-background-flicker That flicker thing was like a toothache all weekend. Happy again. Kind regards, Dermot. __ 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] Link hand disappears in IE
- Original Message -
From: Mary Ellen Curtin
To: css-d@lists.css-discuss.org
Sent: Monday, April 28, 2008 3:27 PM
Subject: Re: [css-d] Link hand disappears in IE
Ha! I found the page I was looking for, and answered my own question.
As suggest by Steve Clay
http://mrclay.org/wd/tests/ir/
cursor: hand is the solution!
I hate to disagree, but there are other problems with your code that I guess
you're not aware of.
In Opera, your link2 doesn't work at all when hovered or clicked.
In IE there is a very nasty delay whilst the links display refreshes.
link1 is only active for part of the image.
I'm not sure why you want to have text underneath the list images, that can't
ever be seen.
I've re-written the code without the text and some div definitions that were
superfluous and it works as I think you want, in IE6, IE7, Firefox, Opera and
Safari.
The code validates and you have no need for a cursor:hand fix, as it doesn't
get removed in the first place. :-)
The positioning in Opera is not quite the same as in the other browsers, but
I'm sure you can remedy that for yourself, if you think it's important.
new code
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titleImage Replacement code/title
style type=text/css
body {background:#CC;}
#navbar {
width:450px;
height:120px;
position:absolute;
top:0;
left:0;
padding:0;
margin: 1em;
}
#navbar ul {
width:385px;
height:auto;
list-style-type:none;
margin: 0;
padding: 0;
}
#navbar li a {
width:128px;
height:53px;
margin:0;
padding:0;
border:none;
}
#link1 a {
position:absolute;
top: 50px;
left: 0px;
width: 128px;
height: 53px;
}
#link2 a {
position:absolute;
top: 50px;
left: 250px;
width: 128px;
height: 53px;
}
#link1 a {
background:url(pix/Google_40blk.jpg) no-repeat; }
#link1 a:visited {
background:url(pix/Google_40wht.jpg) no-repeat; }
#link1 a:hover {
background:url(pix/Google_40gry.jpg) no-repeat; }
#link2 a {
background:url(pix/Google_40wht.jpg) no-repeat;}
#link2 a:visited {
background:url(pix/Google_40blk.jpg) no-repeat; }
#link2 a:hover {
background:url(pix/Google_40gry.jpg) no-repeat; }
/style
/head
body
div id=navbar
pnavigation with image links:/p
ul
lidiv id=link1a href=http://google.com;/a/div/li
lidiv id=link2a href=http://google.com;/a/div/li
/ul
/div
/body
/html
/new code
You could do some tidying up to optimise the code and you might consider gluing
the images together and using background image displacement, if you want the
display to run at optimum speed.
BTW please don't take this the wrong way, but it's more usual to keep your
pix in a folder called images, which is where most people looking at code
expect to find them. It's not essential and it's no judgement on you. Just a
helpful tip. :-)
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Banner Font to big (Take 2)
For a quick fix, try adding: margin-top:3px; to your h1 definition. I don't think it has much to do with AOL, it's apparent in vanilla flavored IE7. It would be better if you use relative addressing for your stylesheets. It took a few minutes for me to work out why, when I altered your stylesheet definition locally, I could see no difference in the browser display, because the HTML was referencing your online stylesheet!! :-) BTW you also have a letter 'o' missing from the URL you typed (below). It obviously should be: http://www.choroideremia.org/crf_header.php It just makes more work for us detectives to do. g 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: Hayden's Harness Attachment To: CSS-D Sent: Saturday, April 26, 2008 8:05 PM Subject: [css-d] Banner Font to big (Take 2) I have a report from an AOL user in the USA that my banner font is so big that it is interferring with my background URL image. The AOL user states the AOL web browser is set to normal. Any Ideas on what is causing the font size increase and how to fix it? Also how can this AOL send me a screen shot? I believe the person is using Windows Vista. HTML http://www.chorideremia.org/crf_header.php CSS http://www.choroideremia.org/css/crf_css1.css Angus MacKinnon Infoforce Services http://www.infoforce-services.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] IE6 problem - something overflows the image
I'm afraid this was not a straightforward fix. :-) Firstly you had missed the closing / for an img src=... in your HTML, so it wouldn't validate. You also had several divs in the HTML, that weren't defined in your stylesheet. I also believe that you spelled Phil incorrectly. If I'm wrong, I'm sure you can put the extra l back. The problems with your stylesheet were various and TBQH I can't remember every change I made. Basically, you had several overlapping divs which interfered with each other and your over-all wrapper wasn't wide enough. Also, your page wasn't wide enough to accommodate your logo image, without overflowing. I did a 'quick fix' for IE6, but that interacted with other definitions and screwed up Firefox, so I have done some 'slow' fixes and it now all works in IE6, IE7, Firefox, Opera and Safari and your HTML validates. To save cluttering up this List with a couple of pages of CSS and HTML, I've uploaded the altered files onto one of my sites, so you can retrieve them. Either use them as they are, or if you're a real masochist, compare them to your originals. grin The files can be found at: www.webbwize.co.uk/Test_Area/Minstrels_Rest/index.html and www.webbwize.co.uk/Test_Area/Minstrels_Rest/css/master.css so you should be able to drop them back into your original locations. BTW, Minstrels Rest looks like a decent place to stay. If I'm in Hastings and need a room, I'll consider it. :-) Regards, Alan. (Located a few miles west of Brighton) www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus - Original Message - From: Krystian - Sunlust To: css-d@lists.css-discuss.org Sent: Sunday, April 27, 2008 10:45 AM Subject: [css-d] IE6 problem - something overflows the image Hi, I'm having a problem with an image and a top border of my navigation on the left sidebar, on IE6 something covers them with the background, and I have no idea why and what element it is, since it displays right on FF, IE7, Opera, Safari... The websites address is: http://www.sunlust.net/test5 Any ideas? Regards, -- Krystian - Sunlust Freelance on the side: Sunlust Designs - http://sunlust.net Full time Website Designer at SME System Solutions Ltd __ 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] egg timer flicker in ie6 on hover
Add:
div#rightNav {
display:inline;
}
to your styles. This won't totally stop the 'flicker' because that's caused by
the pointer crossing from the active element (hand) to the
border/margin/whatever (pointer), but it will get rid of the egg-timer.
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: Dermot Ward
To: css-d@lists.css-discuss.org
Sent: Saturday, April 26, 2008 4:29 PM
Subject: [css-d] egg timer flicker in ie6 on hover
Hi,
Can anyone please tell me why there is that irritating egg timer flicker
on the Categories ul
on hover?
The bullets and dotted underline are background graphics.
The page is here:- http://defaultosc.com
The css and markup validate.
Many thanks.
Dermot.
__
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] Need Text To Wrap Underneath Images
I must admit that I wasn't too keen on your use of tables, but your boss had so decreed! :-) I guess br / is the quick fix to get the job out of the door. g 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: Elli Vizcaino To: Alan K Baker Sent: Friday, April 25, 2008 4:09 AM Subject: Re: [css-d] Need Text To Wrap Underneath Images Thanks Alan, Of course, I did think of using br /s but wasn't sure what the rules were about br /s, since I'm trying to keep the HTML lean and as you yourself have already guessed that yes I was hoping for a CSS anwser. If I don't get one might have to resort to the br / tags indeed. Elli __ 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] Need Text To Wrap Underneath Images
I hope your boss appreciates what you do, beyond the call of duty. Most of them don't. :-( The link (below) covers it and seems a nice way of solving your problem, especially as you have most of the HTML already in place. Just change the tags and style them - neat. 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: Elli Vizcaino To: Alan K Baker ; CSS Discuss Sent: Friday, April 25, 2008 4:41 AM Subject: Re: [css-d] Need Text To Wrap Underneath Images I did a Googling and found this: http://www.tjkdesign.com/articles/how_to_style_thumbnail_and_caption.asp from one of our very own on the list. I had started out with a UL of images and links and it wasn't working especially to achieve the alignment the designers were looking for, so my boss instructed me to revert to tables for that section and which I wasn't crazy about since those images and links aren't tabular data but, based on what I just glanced at, looks like I'll be able to achieve what I'm looking to do, with a DL. Will have to give it a try! - Elli __ 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] Hover delay
I agree. It looks as if (unfortunately) you're right. :-( 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: Ingo Chao To: Alan K Baker Sent: Thursday, April 24, 2008 1:29 PM Subject: Re: [css-d] Hover delay Alan K Baker wrote: Hi all. I'm looking for a way to delay the action of a 'hover' detection for a photo gallery. I don't think CSS could do that. Ingo -- http://www.satzansatz.de/css.html http://www.dolphinsback.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] Hover delay
A good point Tedd. Sometimes we strive to be over complex, when simplicity would probably be better. I have seen plenty of examples of what I want to achieve, but they all rely on each thumbnail being accessible to :hover without triggering any adjacent ones. The only way round that one would be to include a large space between elements to allow the pointer to navigate without triggering. Absolutely wonderful for a CSS maze but totally useless to the normal user! g The jury's still out on whether to use a peripheral array of thumbnails using a fly-out on :hover, or whether to use a block of thumbnails (which would allow an infinite number next to each other) with the fly-out triggered by mouse clicks. I certainly won't be resorting to JavaScript and I'm sure CSS will achieve a satisfactory method. 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: tedd To: Alan K Baker Sent: Thursday, April 24, 2008 5:05 PM Subject: Re: [css-d] Hover delay Alan: That's a bit going against typical pointer functionality. The typical way is of course to move the pointer across things and then click on what you want to see -- that's simple enough and expected. To put a delay into that functionality so that user doesn't have to click, then you'll have to use javascript. But what if a user does click during that time? Do you want the image to enlarge? I think you'll find this is a bigger problem than what you might imagine. My advice, keep it simple and what the user expects. Besides, without javascript that's what it's going to do anyway, right? 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] IE 6 is butchering my pages.
Remove float:left; from .content
that will sort out your float drop, which is also apparent in IE7.
Your HTML will not validate because you have several br tags which should be
br / tags in the particular DOCTYPE you're using. I only checked about but
you should check all pages.
Instead of using a nbsp; above your div id=photo style #photo img { } with
appropriate margins to get your positioning exact and without spurious borders.
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: Jess Jacobs
To: css-d@lists.css-discuss.org
Sent: Tuesday, April 22, 2008 4:23 PM
Subject: [css-d] IE 6 is butchering my pages.
Hi all,
A small troubleshooting problem that is driving me CRAZY:
http://www.akisma.com/design/carrot/
Renders fine in every other browser I've checked, but in IE6, the home
page renders fine, aside from a little bordering around the photo that
looks trashy (any suggestions?) but all the other pages get their main
content bounced out of the main div. Any ideas? I've validated,
checked doctypes, etc, but I'm not a master at this and I'm trying to
improve my browser-argument skills. Also, I haven't checked it in IE7
since I don't have a unique copy of windows (I develop on a mac), so
I'm not sure if it's being screwed over there, too.
Any help would appreciated, especially pointers to articles with a
rundown of IE problems in addition to this specific-case advice.
Thanks all!
Jess
__
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] Hover delay
Hi all. I'm looking for a way to delay the action of a 'hover' detection for a photo gallery. What I want to do is to move the mouse pointer across a block of thumbnails and then have an 'auto-enlargement' appear over the entire block, ONLY after the pointer has been stationary for 500mS or so. Then when the pointer is moved away from the enlargement, the thumbnail block should revert to its former state. I've put a rough example at: http://www.webbwize.co.uk/Test_Area/AllSaints/scripts/gallery.html which is far from satisfactory and contains no real positioning for the 'enlargement'. I don't necessarily want to 'fix' the current code, but to find a way of navigating to the center thumbnails without triggering the hover state, which in any case at present is too unstable. Ideas welcome. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Hover delay
A lot of food for thought on that site, thanks. I can't find exactly what I want, but there are a good few ideas which may make me decide to modify my method. 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: [EMAIL PROTECTED] To: [EMAIL PROTECTED] Sent: Thursday, April 24, 2008 12:53 PM Subject: Re: [css-d] Hover delay You may find what your looking for here http://www.cssplay.co.uk/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] Need Text To Wrap Underneath Images
I hope no-one will mind an off-topic reply, as I think you are genuinely looking for an answer in CSS, but the answer's really in HTML. I think the simplest answer to your question is to use a br / after each image and before each span like this example (first line of your td code: tda href=# target=_blankimg src=images/starledger_icon.gif alt=Star Ledger Logo //aa href=# target=_blankbr /The Star Ledger/abr /spanFREE ADS*/span/td 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: Elli Vizcaino To: CSS Discuss Sent: Friday, April 25, 2008 2:07 AM Subject: [css-d] Need Text To Wrap Underneath Images Hello, How do I get the text to wrap underneath the images in this table: http://e7flux.com/placead/placead2.html - they wrap fine in FF Safari but not in IE 6 or 7. All suggestions welcomed! TIA, Elli __ 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] Hope this is the appropriate way to ask this question
Hi Jonathan. I have found the following book to be excellent and I use it as a 'bible': CSS The Missing Manual by David Sawyer McFarland. Pogue Press/O'Reilly. ISBN-10: 0-596-52687-3 and ISBN-13: 978-0-596-52687-0 Also Eric A Meyer's CSS Pocket Reference is a helpful, easy to carry volume. ISBN 0-596-00777-9 and there's a very handy crib-sheet to be found at: http://www.ilovejackdaniels.com/cheat-sheets/. Just scroll down to the CSS one. 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: Jonathan To: css list list Sent: Wednesday, April 23, 2008 5:06 PM Subject: [css-d] Hope this is the appropriate way to ask this question I have looked at and read several CSS books. Do you have any recommendations as I have not found one that I liked __ 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] IE6 fixed positioning woes
Hi Georg.
I'll try that out later today/tomorrow.
I did wonder whether there was some info that was not in the original article.
You have kindly provided it. Thanks.
As Mr Schwarzenegger said I'll be back (to report that is g)
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: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Saturday, April 19, 2008 8:34 AM
Subject: Re: [css-d] IE6 fixed positioning woes
Alan K Baker wrote:
I viewed the 'fixed positioning' fix for IE6 at:
http://web.tampabay.rr.com/bmerkey/examples/fake-position-fixed.html
and it works fine.
IE7, Firefox, Opera and Safari all scroll the main content whilst
leaving the nav bar fixed at the left top, as expected. IE6 scrolls
everything.
http://www.webbwize.co.uk/Test_Area/TEP/scripts/Profnutty.htm
Add...
#container, #main, #homehead {position: static;}
...and may also have to restyle positioning for...
#hdrtopborder, #hdrbotborder, #hcontlhsep, #hcontlhmidsep,
#hcontrhmidsep, #hcontrhsep, #hcontbotborder
#hdrrhborder, #hcontrhborder, #contlhsep, #contmidsep, #contrhsep
...in the CC for IE6.
What the 'fixed positioning' fix for IE6 article does not mention is
that _all_ 'absolute' or 'relative' positioned elements are affected by
the fix. This tends to make the fix fail in IE6 initially, but with
a bit of careful restyling of _interfering_ positioning you _can_ make
it work - for most layouts.
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] IE6 fixed positioning woes
Hi again Georg.
I played around with the CSS (below) today and it's only a partial fix.
It makes the navbar appear to be fixed when scrolling vertically, but the
entire page scrolls horizontally. Also, if you resize the browser, it gets to a
certain point where the window height is shorter than the navbar and even the
'vertical fix' fails to work.
Even though I added #homecontent to the static definition, it screwed the
positioning of elements in the home page in all browsers, but that's probably
because I missed a 'static' in the home page somewhere.
I didn't need to reposition anything on the other pages, but I suspect I may
run foul with absolutes, once the tables are removed.
Thanks for trying anyway - the search continues.
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: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Saturday, April 19, 2008 8:34 AM
Subject: Re: [css-d] IE6 fixed positioning woes
Alan K Baker wrote:
I viewed the 'fixed positioning' fix for IE6 at:
http://web.tampabay.rr.com/bmerkey/examples/fake-position-fixed.html
and it works fine.
IE7, Firefox, Opera and Safari all scroll the main content whilst
leaving the nav bar fixed at the left top, as expected. IE6 scrolls
everything.
http://www.webbwize.co.uk/Test_Area/TEP/scripts/Profnutty.htm
Add...
#container, #main, #homehead {position: static;}
...and may also have to restyle positioning for...
#hdrtopborder, #hdrbotborder, #hcontlhsep, #hcontlhmidsep,
#hcontrhmidsep, #hcontrhsep, #hcontbotborder
#hdrrhborder, #hcontrhborder, #contlhsep, #contmidsep, #contrhsep
...in the CC for IE6.
What the 'fixed positioning' fix for IE6 article does not mention is
that _all_ 'absolute' or 'relative' positioned elements are affected by
the fix. This tends to make the fix fail in IE6 initially, but with
a bit of careful restyling of _interfering_ positioning you _can_ make
it work - for most layouts.
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] CSS Drop-Down in IE6?
Victor Subervi wrote:
Hi:
Has anyone come up with a css drop-down menu that works in both IE7 *and*
IE6? Is it even possible? I see Chris Case tried as much, and no one seems
to have responded to his post...
The one below works in IE6, IE7, Firefox, Opera and Safari and can be adapted,
added or subtracted to, according to needs.
-
CSS:
body, html {
padding:0;
margin:0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
#menu {
background-color:#d3e4f1;
position:relative;
z-index:100;
border-right:1px solid #063;
border-bottom:1px solid #063;
height:31px;
width:150px;
}
#menu ul {
padding:0;
margin:0;
list-style-type:none;
}
#menu li {
float:left;
width:150px;
position:relative;
}
#menu a {
display:block;
text-decoration:none;
color:#006633;
height:30px;
background-color:#cdddca;
line-height:29px;
border:1px solid #063;
border-right:0;
border-bottom:0;
padding-left:10px;
}
#menu table {
position:absolute;
border-collapse:collapse;
top:0px;
left:0px;
}
#menu ul ul {
visibility:hidden;
position:absolute;
top:31px;
left:0px;
width:150px;
border-right:1px solid #063;
border-bottom:1px solid #063;
}
#menu a:hover {
color:#fff;
background-color:#949e6c;
}
/* 1st level sub items */
#menu ul :hover ul {
visibility:visible;
}
#menu ul :hover ul ul {
visibility:hidden;
}
/* 2nd level sub items */
#menu ul :hover ul :hover ul {
visibility:visible;
}
#menu ul :hover ul :hover ul ul {
visibility:hidden;
}
#menu ul ul ul {
left:150px;
top:0;
}
#menu .sub_left {
left:-150px;
}
/* 3rd level sub items */
#menu ul :hover ul :hover ul :hover ul {
visibility:visible;
}
#menu ul :hover ul :hover ul :hover ul ul {
visibility:hidden;
}
/* 4th level sub items */
#menu ul :hover ul :hover ul :hover ul :hover ul {
visibility:visible;
}
#menu ul :hover ul :hover ul :hover ul :hover ul ul{
visibility:hidden;
}
/* Make path visible */
#menu :hover a {
color:#fff;
background-color:#949e6c;
-
HTML:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titleMulti-level Dropdown Menu/title
link href=stylesheet.css rel=stylesheet type=text/css /
/head
body
div id=menu
ul
lia href=#Link 1!--[if gte IE 7]!--/a!--![endif]--
!--[if lte IE 6]tabletrtd![endif]--
ul
lia href=#Sub Link 1/a/li
lia href=#Sub Link 2!--[if gte IE 7]!--/a!--![endif]--
!--[if lte IE 6]tabletrtd![endif]--
ul
lia href=#Sub Sub Link 1/a/li
lia href=#Sub Sub Link 1/a/li
lia href=#Sub Sub Link 1/a/li
lia href=#Sub Sub Link 1!--[if gte IE 7]!--/a!--![endif]--
!--[if lte IE 6]tabletrtd![endif]--
ul
lia href=#Sub Sub Sub Link 1/a/li
lia href=#Sub Sub Sub Link 1!--[if gte IE 7]!--/a!--![endif]--
!--[if lte IE 6]tabletrtd![endif]--
ul
lia href=#Sub Sub Sub Sub Link 1/a/li
lia href=#Sub Sub Sub Sub Link 1/a/li
lia href=#Sub Sub Sub Sub Link 1/a/li
lia href=#Sub Sub Sub Sub Link 1/a/li
/ul
!--[if lte IE 6]/td/tr/table/a![endif]--
/li
lia href=#Sub Sub Sub Link 1/a/li
lia href=#Sub Sub Sub Link 1/a/li
/ul
!--[if lte IE 6]/td/tr/table/a![endif]--
/li
/ul
/body
/html
-
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Formatting Problem
- Original Message - From: David Laakso To: Alan K Baker Cc: css discuss Sent: Wednesday, April 16, 2008 8:32 PM Subject: Re: [css-d] Formatting Problem I got lost. Is this your thread, or did you steal it? Regardless, Google, subject line: position fixed The first 10 links deal with the problem and its solution. -- Neither. I replied to one item in the thread and made a small (request) comment. I did try Google before and didn't find a really satisfactory solution, but I do have one now. As long as it doesn't upset anything else in my CSS, it's a perfect answer. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Formatting Problem :: position fixed
http://web.tampabay.rr.com/bmerkey/examples/fake-position-fixed.html 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: David Laakso To: Alan K Baker Cc: css-d Sent: Thursday, April 17, 2008 12:24 AM Subject: Re: [css-d] Formatting Problem :: position fixed Good! Share the solution. -- 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] IE6 IE7 together [was: Text Sizing and Div Height]
Chris. You can run IE6 and IE7 and a few others side-by-side, I'm doing it right now. :-) See: http://tredosoft.com/Multiple_IE 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: Chris Morse To: css-d@lists.css-discuss.org Sent: Tuesday, April 15, 2008 11:00 PM Subject: [css-d] Text Sizing and Div Height (It is a real pain that you can't run IE6 and IE7 side-by-side.).. Thanks, Chris __ 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] Combining multiple stylesheets and a padding question
- Original Message -
From: Kenoli Oleari
To: CSS Mailing List
Sent: Monday, April 14, 2008 2:27 PM
Subject: [css-d] Combining multiple stylesheets and a padding question
Two questions:
Re combining multiple stylesheets--
Can someone provide me with the exact syntax for linking multiple
stylesheets so they can be linked in an html head with a single link
call. What I want to do is to have one link in the head of my html
document that links to a number of stylesheets or to one stylesheet
that is somehow linked to a number of other stylesheets.
I need both the syntax for linking the stylesheets to a single
stylesheet and the syntax that needs to be in the html head.
I've found references that say that this can be done using @import
within a stylesheet linking it to others or link tags within a
stylesheet with a common title attribute but I can't figure out the
correct syntax at each end for doing this.
Re padding --
Why do the dimensions of a div get bigger when I change the padding
in the div? I thought padding simply indented content from the outer
dimension of a div. Is there any way to create padding in a div
and keeping the outer dimensions of the div the same without
decreasing the size of the div by the amount of the padding?
Here is the style where the padding is causing the size of the div to
expand:
.titleDiv {
position:relative;
float: left;
width: 451px;
height:87px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding: 12px;
background-color: #FF00FF;
}
Thanks,
--Kenoli
Kenoli.
I think what you want is in this example:
@import 'global.css';
@import 'nav.css';
@import 'right.css';
@import 'left.css';
which can be in the top a stylesheet which is linked in the HTML.
The reason that the div size increases with the padding (and margins) is
because the browser calculates the over-all size of the div as the sizes you
state for the div and then adds the padding and margins to work out the
over-all size. If you want to keep the div to your chosen size, then subtract
any padding and margins from the appropriate width or height.
i.e.
.divsize {
width:100px;
height:100px;
margin:0;
padding:0;
}
will give you a box of exactly 100px wide x 100px high.
.divsize {
width:100px;
height:100px;
margin:10px 0 10px 0;
padding:0 5px 0 5px;
}
will give you a box of 110px wide x 120px high.
so using your example to get back to the size you actually state, you'd have
to redefine like:
.titleDiv {
position:relative;
float: left;
width: 427px; /* was 451px */
height:63px; /* was 87px */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding: 12px; /* Don't forget that this is padding on all sides so has
to be counted double in the width/height calc! */
background-color: #FF00FF;
}
I hope this helps.
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Inconsistent behavour with z-index in IE6/7
Hi all.
I just came across another discrepancy with IE6 and IE7.
I'm using some gradients as borders/separators and some even have a border
color set.
To get the effect that I want, it's important that they overlap in the right
order, so I'm using z-index to set the priority.
The stylesheet is fairly conventional with a site container, navbar, header and
main contents.
I've put the home page up for inspection at:
http://www.webbwize.co.uk/Test_Area/TEP/index.htm
and the CSS is at:
http://www.webbwize.co.uk/Test_Area/TEP/scripts/stylesheet.css
What should be seen is the header with a top horizontal gradient border with
appropriate white and gray border colors set, along with two vertical gradient
borders, also with appropriate white and gray border colors set. Under this
there should be a header bottom gradient border with appropriate white and gray
border colors set, and lastly there should be an empty main container, which is
described in the div #homecontent {}. All of the gradient borders should be
fully visible apart from where they overlap each other. This is the case in
Firefox, Opera and Safari.
In IE6 and IE7 the #homecontent box is being drawn over the lower gradient
border, even though its z-index is set to 0 and all of the gradient borders are
set above 0. I've given #homecontent a red border (which would not normally be
there) to demonstrate the top edge of the lower div. If there was no
background color set and no border on #homecontent, the effect would not be
seen. The only way to make IE6/7 behave is to set z-index to -1 (or [I think]
any negative number) or to set the header container ( #homehead ) z-index to 1
(probably the right solution).
I wonder if this has been documented anywhere?
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Inconsistent behavour with z-index in IE6/7
As I already have a fix, I agree that it's no big deal, but in the interests of knowledge furtherance, I don't believe that it's a trivial pursuit. :-) Had there not been a fix, it would have been a major issue. 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: David Laakso To: Alan K Baker Cc: css-d Sent: Monday, April 14, 2008 9:21 PM Subject: Re: [css-d] Inconsistent behavour with z-index in IE6/7 I think you may want to evaluate your priorities. Produce a structurally sound page that withstands user discretion, and the gradient issue you wrote about will be exactly what it is-- a trivial and insignificant pursuit. -- 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] Navigation bar
Andrew. In the case of my [ :active ] problem, I believe that none of the browsers is actually at fault, and IE7 does actually do what I want and behaves in a way I'd logically expect, which is probably quite unusual for IE7. :-) It's simply a minor discrepancy in implementation between browsers - no big deal. I have far more problems with IE6 than all the other browsers! IE7 is a pussy cat, compared to IE6. g In the case of my vertical spacing on text, this is just my wish to improve my code. It's not a browser fault at all. 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: Andrew Doades To: Alan Gresley Cc: Alan K Baker ; css-d Sent: Saturday, April 12, 2008 11:48 AM Subject: Re: [css-d] Navigation bar Hello all... I could not help picking up on a bit about IE7, I recently attempted a sidebar for my website, and all now works (to some extent) but for IE7. I was just wondering what is with IE7, IE6 used to be fine, it always worked, same with FF but why is 7 casing so many problems? 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] Navigation bar
Alan. As there are a few issues here and interaction will be improved (IMO) I am replying to your message, by interspersing my replies within yours. 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: Alan Gresley To: Alan K Baker Cc: css-d Sent: Saturday, April 12, 2008 10:09 AM Subject: Re: [css-d] Navigation bar There many billions of pages needing the same treatment. Please take a look at this screen shot. Answered privately. Is this the fixed navigation where the lower parts are hidden outside the viewpoint. My screen is on 800px high. Is this navigation within frames? No, it's apparent on any button that's clicked. They all behave in the same way. Remove the frames as it make it near impossible for anyone to help. The frames will be removed, but the site is presented 'as-is' to allow you guys to see the problem, not for you to attempt to retrieve code from it. That's why I posted the relevant code in my message. OK, where do you mention that .oneline and .twolines is part of the navigation. Some on this list are good detectives since. We have to use our web developers toolbar [1] outline current element feature to locate these classes. It's mentioned in the line I've included the appropriate part of the stylesheet and the HTML below, to save you wading through the dreaded frames maze. At present my text is centered by [ .oneline a ] and [ .twolines a ] (below)., which you've edited out. :-) I've probably missed something obvious!! Yes. When I check you source code all I see is. frameset frame frame base /frameset noframes If you are reading this text, your browser is frames challenged. More up to date browsers are readily available. /noframes The good browsers are not framed challenged. They just don't use MS propriety garbage code. 'Fraid I disagree. Frames have been around for a long time, along with all their faults. None of today's reasonably up-to-date browsers has a problem with the site as it is/was. M$ proprietary code is here to stay and the greater majority of browser public are using it, unfortunately for us, especially in the case of browsers below IE7, which itself is far from perfect. Not to labor a point, as we're getting off topic, but the frames will be removed soon and the problem will cease to exist. :-) So you have to make it easy. :-) Sometimes it is easier just to have un-style text to begin with. The only way I could make it any easier (as you say) is to remove the frames, but really this is totally unnecessary. I've already posted the relevant code in my message, for inspection. There's nothing 'hidden' on the live site that would affect it. I dumped the site to a test area, merely as an illustration for this forum, so that the effects can be seen. Hell, being a USA originated forum, I even spelled my message in 'American' and ignored the protests of my UK spell-checker. grin __ 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] Navigation bar
Hi all.
I'm in the process of converting an old frames/tables/JavaScript site to all
CSS. It can be found at: http://www.webbwize.co.uk/Test_Area/TEP/index.html
I am looking for a slightly more 'elegant' way of vertically centering text
depending on whether there are one or two lines.
I've included the appropriate part of the stylesheet and the HTML below, to
save you wading through the dreaded frames maze. At present my text is centered
by [ .oneline a ] and [ .twolines a ] (below).
I've also just noticed a problem in all browsers except IE7. What I want to
happen is for the currently selected item to show a different background and to
change text color, as in [ #navbar a:active ] (below) and for this state to
remain until another selection is made. IE7 does what I want, but other
browsers are inconsistent. Some will show the correct state whilst the mouse
button is down and it's possible in at least one other to select an item and
drag the pointer away from the item whilst holding the button down and the
active state will remain. It's late at night and I've probably missed something
obvious!!
Help would be much appreciated.
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
www.webbwize.co.uk
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Flatulus Antiquitus
/* Main navigation menu */
/* Define vertical outer box with borders/bevels */
#navbar {
background-image:url(../images/logos/logo.gif);
background-repeat:no-repeat;
background-position:top;
position:absolute;
top:0;
left:0;
width:125px;
height:auto;
margin:0;
padding:0;
border-top:5px solid #dcf6ff;
border-right:5px solid #999;
border-bottom:5px solid #999;
border-left:5px solid #dcf6ff;
}
/* Limit list size and set margin to clear navbar logo */
#navbar ul {
font:9px Arial, Helvetica, sans-serif;
font-weight:bold;
text-align:center;
list-style-type:none;
margin:68px 0 0 0;
padding:0;
}
/* Single line of text */
.oneline a {
height:14px;
padding:8px 0 8px 3px;
}
/* Two lines of text */
.twolines a {
height:26px;
padding:2px 0 2px 3px;
}
/* Style set background for active list items */
#navbar a {
background-image:url(../images/buttons/navstd1x30.gif);
background-repeat:repeat;
text-decoration:none;
text-transform:uppercase; /*All capitals for consistency */
color:black;
display:block;
border-bottom:5px solid #cce6ff;
}
/* Set new background position for rollover */
#navbar a:hover {
background-image:url(../images/buttons/navhover1x30.gif);
background-repeat:repeat;
}
/* Set background for current item */
#navbar a:active {
background-image:url(../images/buttons/navactive1x30.gif);
background-repeat:repeat;
color:white;
}
body
div id=navbar
ul
li class=onelinea href=Home.htm target=tepmainHOME PAGE/a/li
li class=onelinea href=VarietyDays.htm target=tepmainTHOSE
VARIETY DAYS/a/li
li class=twolinesa href=Liberace.htm target=tepmainLIBERACEbr
/LIVE FROM LAS VEGAS/a/li
li class=twolinesa href=MandMs.htm target=tepmainMAGIC AND THEBR
/MUSICALS/a/li
li class=twolinesa href=SwingCrazy.htm target=tepmainERIC
DELANEYbr /SWING CRAZY/a/li
li class=onelinea href=Palladium.htm target=tepmainPALLADIUM
MEMORIES/a/li
li class=twolinesa href=Cricket.htm target=tepmainJIMMY
CRICKET'Sbr /MATINEE MADNESS/a/li
li class=onelinea href=ThreeEms.htm target=tepmainMUSIC MUSIC
MUSIC/a/li
li class=onelinea href=Pantomime.htm
target=tepmainPANTOMIME/a/li
li class=onelinea href=Abracadabra.htm
target=tepmainABRACADABRA!/a/li
li class=onelinea href=Profnutty.htm target=tepmainPROFESSOR
NUTTY/a/li
li class=onelinea href=Summershows.htm target=tepmainSUMMER
SHOWS/a/li
li class=twolinesa href=Christmas.htm target=tepmainTHE MAGICbr
/OF CHRISTMAS/a/li
li class=onelinea href=Dates.htm target=tepmainSHOW DATES/a/li
li class=onelinea href=About.htm target=tepmainABOUT US/a/li
li class=onelinea href=Contact.htm target=tepmainCONTACT
DETAILS/a/li
/ul
/div
/body
/html
__
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] hr / styling
Hi Manfred. Safari behaves in a similar way to Opera. In non-IE browsers, when a border is shown it appears to be in an inset style in two colors, but looking at your code, you don't set border-style so I don't know where it inherits that from. Firefox is even worse as it doesn't seem to know what fuchsia and aqua are so displays white with inset borders in shades of gray. The borders do take on the same hue family in lime! What a total nightmare and a minefield for the unwary. I must admit that if I'd specified the original hr that I used, I'd have made a 1px box with a background color and specified its length. ISTM that the only really useful browser consistent attribute that hr has is its ability to alter its width to suit its container. :-) 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: Manfred Staudinger To: Philippe Wittenbergh Cc: CSS-D Sent: Tuesday, April 08, 2008 9:28 PM Subject: Re: [css-d] hr / styling Reading through your responses I found it necessary to set up a small test page to show the effect of specifying different properties for color on the hr element. http://test.rudolphina.org/hr.html Because of the number of bugs, interpreting the results is a non-trivial task certainly. Some examples: a) IE 6 and IE 7 do show the background-color specified - but if the hr has color specified also, you have to set color: none; to get it. b) Firefox 2.0.0.13 ignores height completely. c) Opera 9.25 does honor the border-color property if specified, but fails to use the color property in its absence. d) margin: 0; does what you would expect in Firefox 2.0.0.13 and Opera 9.25 but not for IE 6 and IE 7, where you have to specify margin: -7px 0; Enjoy finding more bugs. For your reference (Box model): http://www.w3.org/TR/CSS21/box.html#border-color-properties I would also be interested to hear about Safari, Fx 3b and IE 8b. Thanks, Manfred __ 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] hr / styling
Safari 3.1 (523.13) Screenshot is at: www.webbwize.co.uk/Test_Area/images/Safarihr.jpg Yes, I realise that Firefox knows about colors, I was only talking about them being unknown when dealing with hr. Browser bugs/differences. Who needs 'em? :-) 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: Manfred Staudinger To: Alan K Baker Cc: css-d Sent: Wednesday, April 09, 2008 12:42 AM Subject: Re: [css-d] hr / styling Hi Alan, Safari behaves in a similar way to Opera. Which Safari and do you have a screen shot? you don't set border-style so I don't know where it inherits that Philippe Wittenbergh has shown us (in this thread) the default settings for Fx3, so you might want to look into it again. Firefox is even worse as it doesn't seem to know what fuchsia and aqua are so displays white with inset borders in shades of gray. Of course Fx know these colors, but it does not want to apply any! (to proof that I've updated http://test.rudolphina.org/hr.html ) the only really useful browser consistent attribute that hr has is its ability to alter its width It is not as bad as you see it now: if you apply a padding for non-IE and reserve height for IE you will be able to use the background-color consistently. Cheers, Manfred On 09/04/2008, Alan K Baker [EMAIL PROTECTED] wrote: Hi Manfred. Safari behaves in a similar way to Opera. In non-IE browsers, when a border is shown it appears to be in an inset style in two colors, but looking at your code, you don't set border-style so I don't know where it inherits that from. Firefox is even worse as it doesn't seem to know what fuchsia and aqua are so displays white with inset borders in shades of gray. The borders do take on the same hue family in lime! What a total nightmare and a minefield for the unwary. I must admit that if I'd specified the original hr that I used, I'd have made a 1px box with a background color and specified its length. ISTM that the only really useful browser consistent attribute that hr has is its ability to alter its width to suit its container. :-) 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: Manfred Staudinger To: Philippe Wittenbergh Cc: CSS-D Sent: Tuesday, April 08, 2008 9:28 PM Subject: Re: [css-d] hr / styling Reading through your responses I found it necessary to set up a small test page to show the effect of specifying different properties for color on the hr element. http://test.rudolphina.org/hr.html Because of the number of bugs, interpreting the results is a non-trivial task certainly. Some examples: a) IE 6 and IE 7 do show the background-color specified - but if the hr has color specified also, you have to set color: none; to get it. b) Firefox 2.0.0.13 ignores height completely. c) Opera 9.25 does honor the border-color property if specified, but fails to use the color property in its absence. d) margin: 0; does what you would expect in Firefox 2.0.0.13 and Opera 9.25 but not for IE 6 and IE 7, where you have to specify margin: -7px 0; Enjoy finding more bugs. For your reference (Box model): http://www.w3.org/TR/CSS21/box.html#border-color-properties I would also be interested to hear about Safari, Fx 3b and IE 8b. Thanks, Manfred __ 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] hr / styling
Hi Manfred.
With thanks to you, Georg, Michael and Philippe.
To clear up a few possible misunderstandings:
Yes, I should have taken time to read the 'standard'.
I have no issue with the concepts of Margin and padding. Sorry if I gave the
wrong impression. I also have no problem with the concept of hr being a block
element.
The problems with the varying 'margin' were due to faulty testing, due to
'browser fighting' by me to try to place some 90px text exactly where I wanted
it, with a hr beneath, and finding that different browsers gave me vastly
varying margins. Just try the following in several browsers:
bodystyleh1 {font-family:Times New Roman, Times,
serif;font-size:90px;font-weight:normal;color:#d00;}/styleh1Some
stuff/h1/body
and view the differences in transparent space, above and below the letters.
(I'm deliberately avoiding calling it margin or padding, to avoid semantic
confusion).
Depending on the browser, there are different methods needed to address the
actual color of horizontal line in hr. My test results are below:
hr {
background-color:#d00; /* Firefox */ Implies that the 'line' is entirely
constructed of padding and transparent space is 'margin'.
color:#d00; /* IE 6 7 */ Implies that the line is
classed as text, the element cannot have padding because background-color does
nothing, and its transparent space is 'margin' .
border-color:#d00; /* Opera Safari */Implies that the line is classed as
a border, the element cannot have padding because background-color does
nothing, and its transparent space is 'margin' .
margin:0;
padding:0;
}
If one of these methods is the de-facto standard, then hr must be classed as
a special case, where some rules of block styling do not apply, or at least one
of the browsers is breaking the rules.
All of this as part of friendly discussion and IMO, of course.
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: Manfred Staudinger
To: Alan K Baker
Cc: css-d
Sent: Sunday, April 06, 2008 2:56 AM
Subject: Re: [css-d] hr / styling
Hi Alan,
Without me looking up specifications, if color has no meaning, then how do
you propose to change the color of a horizontal rule? It is not a border,
neither is it a background, so
how else would you style its color property? To answer my own question,
Mozilla
obviously think it's a background element, but then you can't simply put
printable
characters on top of it, so they are breaking the rules.
If you take a look at the HTML 4.01 Strict DTD
http://www.w3.org/TR/html401/sgml/dtd.html
you will see that HR is a block-element (maybe you meant this when you
say background element)! This answers also your question but in a
different way: looking up the specification is always helpful to learn
what the rules are.
I didn't say you are making false claims but you use some basic
notion very freely. When it comes to differentiate between margin and
padding this should be simple: for example the padding takes the
background-color but the margin not. So if you have a block-level
element and you have specified a background-color then the transparent
space is the elements margin area, isn't it?
The code you posted looks almost the same in Firefox and IE 6.
Was this your
intention?
Above I showed you that hr is defined as a block-level element in
the HTML 4.01 Strict DTD. As long as you don't backup the foreground
element with some evidence, I have to assume it's only your personal
opinion.
Manfred
__
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] IE bug with background images on multi-line inline links
Works fine for me in IE6, IE7, Opera, Firefox and Safari. My only complaint is that when you click on the language button the menu items change language, but the main Home text does not, even after visiting another page and clicking on Home.. 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: Adi Palazova To: css-d@lists.css-discuss.org Sent: Saturday, April 05, 2008 11:06 PM Subject: [css-d] IE bug with background images on multi-line inline links ..The other reason I’m writing here is to ask if you can help me with the site check. I’m away from home for 2-3 months and don’t have the possibility to check it in some browsers. I’ll be very grateful if you let me know about any browser problem that you may see, especially with Mac and Linux browsers. The URL is: http://adipalaz.awardspace.com Thank you in advance Best regards Adriana __ 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] Almost there!! But my nav buttons in IE...
I would certainly advocate setting up the list method. It shouldn't take you more than 1/2 an hour. :-) I have nothing against JavaScript per se, but I have to agree with you. If you're writing the main part in CSS, it's sensible to do all you can and avoid unnecessary code. Not only that, but the CSS is far more compact and easier to write and maintain. I maintain a site where they often want to change the buttons or add or subtract them. I dread the nightmare I have to go through having to 'make' each button 3 times and overlay the text in XaraX, then export and let JavaScript do the entire placement, having first had to calculate the number of buttons, the placement and the link in several places in the HTML. It's an older site (with frames) and I will be converting it one day. 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: tmesa.mesadesignhouse To: Alan K Baker Cc: CSS-D List Sent: Saturday, April 05, 2008 7:49 AM Subject: Re: [css-d] Almost there!! But my nav buttons in IE... Yeah, I'll be doing that, because the a:visited and a:hover will be swapping out the image with another. Perhaps that's what I need to do before I worry any more about the spacing. Who says you need JavaScript to swap images?? I used the CSS image swapping with a website I did for a coffee shop, and as you hovered over each of the nav buttons, the bullets - er, coffee beans - would rotate, so it looks like they're jumping beans. :-) The power of CSS. Thanks! Theresa Mesa Mesa Design House http://mesadesignhouse.com 909-796-5739 909-796-5789 (Fax) __ 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] Anchor tags
On the money Georg, thank you. Thanks also to Alan for getting me 90% of the
way.
It works in IE6, IE7, Firefox, Opera and Safari. I haven't been brave enough to
install IE8 yet. g
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: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Saturday, April 05, 2008 9:00 AM
Subject: Re: [css-d] Anchor tags
Make it:
#selectable, #selectable a {
position: absolute;
bottom: 0;
left: 0;
height: 1px;
width: 100%;
background-image: url(trans1px.htm);
z-index: 1;
}
...and the whole page will be covered by a working anchor in all
browsers - I think (didn't test in IE7).
The problem is how browsers calculate height in percentage - different
and depending on case, and there's not much to gain from battling their
differences for a case like this.
The easiest solution is to *not* use percentage for height but instead
make make the element/anchor *too tall*. The overshooting part
disappears above the screen where it won't be noticed and has no effect
on anything.
This method is demonstrated/tested to the extreme here...
http://www.gunlaug.no/contents/wd_chaos_07.html
...and we don't have to go to the extremes for the size of today's and
tomorrow's screens and browser-windows.
regards
Georg
__
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] Anchor tags
- Original Message -
From: Alan K Baker
To: css-d
Sent: Saturday, April 05, 2008 1:23 PM
Subject: Re: Anchor tags
On the money Georg, thank you
In reply to myself, I just realised that the url in the code did not exist, but
the code still works. If I reference the transparency file correctly, it
doesn't work in IE6. Neither does it work with no background url at all.
Referencing the file as junk.gif (which does not exist) - all's fine.
As Alan says, Welcome to the strange and wonderful world of Internet Explorer.
*/**/+/**/:-)/*/*/ . :-)
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: Gunlaug Sørtun
To: Alan K Baker
Cc: css-d
Sent: Saturday, April 05, 2008 9:00 AM
Subject: Re: [css-d] Anchor tags
Make it:
#selectable, #selectable a {
position: absolute;
bottom: 0;
left: 0;
height: 1px;
width: 100%;
background-image: url(trans1px.htm);
z-index: 1;
}
...and the whole page will be covered by a working anchor in all
browsers - I think (didn't test in IE7).
The problem is how browsers calculate height in percentage - different
and depending on case, and there's not much to gain from battling their
differences for a case like this.
The easiest solution is to *not* use percentage for height but instead
make make the element/anchor *too tall*. The overshooting part
disappears above the screen where it won't be noticed and has no effect
on anything.
This method is demonstrated/tested to the extreme here...
http://www.gunlaug.no/contents/wd_chaos_07.html
...and we don't have to go to the extremes for the size of today's and
tomorrow's screens and browser-windows.
regards
Georg
__
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] List reply method
I know that I've only been here '5 minutes' but I would like to respectfully ask the List Owner if the settings can be changed to a similar method used by Yahoo Groups, so that clicking the email client's Reply button, sets up the return address as the List and not the individual Sender. If you then want to send a private message, it's easy enough to look up the original sender's address and paste it in. The current method is confusing, in that clicking Reply usually replies to the Sender, not the List and clicking Reply-All sometimes puts the List address in the right place, and sometimes not, which then involves a pile of address manipulation for each reply. If it is changed as I suggest, there wouldn't be the huge amount of duplicate messages, which is almost on a one-to-one basis, and replies wouldn't go just to the Sender by mistake, which denies the List the benefit of the wisdom in the reply. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Background in IE6 and 7
You have white space in your css definition which is confusing the browsers.
It's between the 'tr' and the '.header':
/* Your code */
table.styledTable thead tr .header {
background: transparent url(bg.gif) center right no-repeat;
text-align: left;
}
/* Amended code */
table.styledTable thead tr.header {
background: transparent url(bg.gif) center right no-repeat;
text-align: left;
}
Subtle but significant. g
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: Mark Finney
To: Alan Gresley
Cc: CSS Mailing List
Sent: Saturday, April 05, 2008 1:32 PM
Subject: Re: [css-d] Background in IE6 and 7
Thanks for your advice,
I have a mock up here...
http://cathaytrade.co.uk/tabletest/
What am I doing wrong?
Thanks in advance!
__
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] IE8 : Padding
From: Alan Gresley To: Foundation Flash Cc: css-d@lists.css-discuss.org Sent: Saturday, April 05, 2008 2:19 PM Subject: Re: [css-d] IE8 : Padding .Don't hack for IE8 (though I and others know how :-). It's MS job to fix IE8. Alan http://css-class.com/test/ Now here, I would absolutely agree with you. There's no point in hacking around IE8 as it will change before Release, hopefully for the better. I wouldn't even want Micro$oft to even think that someone might hack round a bug, in case they get complacent and lazy. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] Background in IE6 and 7
Replying to both your messages: Transparent is valid for IE7 but will only work in IE6 if the file's a gif (as yours are) not a png. In answer to your other reply, the fact remains that there was/is a white space in your code which messed up the table head rendering on my browser. Unless I've totally misunderstood, the thead is not in question. The th IS a child of tr and has been given a class of header, but because of the errant white space, the browser won't apply the header class to the th. Have you actually tried my amendment? It certainly made things jump into life for me, and as I say, unless I've totally misunderstood you, it does do what you want it to do. 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: Mark Finney To: Alan K Baker Cc: css-d Sent: Saturday, April 05, 2008 3:13 PM Subject: Re: [css-d] Background in IE6 and 7 I altered the css to include th.header, but as I thought this makes no difference. Anybody have a suggestion as to why IE is forcing the background to be white when it is set to transparent? Is transparent not a valid value for IE??? TIA, Mark On 05/04/2008, Mark Finney [EMAIL PROTECTED] wrote: Thanks, but the .header is not for the tr... it is for the child of the tr... the white space is deliberate... 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/
Re: [css-d] hr / styling
- Original Message -
From: Manfred Staudinger
To: css-d
Cc: Alan K Baker
Sent: Saturday, April 05, 2008 7:33 PM
Subject: Re: hr / styling
Alan, you did _not_ respond to the list and therefore I'll repeat your
message here:
Please note that color does not have any meaning if the element has no
content. This only leaves border-color and background-color to specify
any color for styling.
I didn't measure enormous but an estimate is over 20px, which is far more
than a simple margin error.
Sometimes you claim it to be a padding (right) and sometimes a margin
(false, as no color specification is applicable to the margin).
I'm sorry, yes the code you posted is very simple, but it does not
show any bug in Firefox 2.0.0.13. The only problem is, you forgot to
show us the rule from your stylesheet, which causes the padding (is
over 20px) on the hr /. As a guess, that rule might just look like
this:
html * {padding: 12px 0 12px 0;}
Manfred
You're right, my reply went direct to you by mistake. On another topic, I
rest my case!! g
Without me looking up specifications, if color has no meaning, then how do
you propose to change the color of a horizontal rule? It is not a border,
neither is it a background, so how else would you style its color property? To
answer my own question, Mozilla obviously think it's a background element, but
then you can't simply put printable characters on top of it, so they are
breaking the rules.
Not sure why you say that I am making false claims. If I appear to be
claiming something to be a padding and sometimes a margin, that is not my
intention. I am well aware that 'margin' has no color property, why would it?
It's a non-printable spacing property. The extra spacing that Firefox inserts
is totally transparent, therefore I can't tell whether it's a margin or padding
in the true sense of the words. It's a 'lump' of transparency that's being
inserted, and it's only Firefox that does it. I call that a bug.
I did not forget to show the rule from my stylesheet that causes padding.
Firstly, if that was the case, it would happen in all browsers and secondly
there is no such rule in my stylesheet. I did not show the code for 'body'
because it is irrelevant in this case. There's nothing in it to cause errant
spacing and there is no html * etc code in my stylesheet.
FWIW I have included below, all that is above the 'hr' definition and there's
nothing after it to affect it. The code can be tested exactly as it is below,
by saving it as a set of styles in an HTML document and a simple hr / command
inserted in the body below it. In Firefox only, it will space itself far more
than a single line height from the top of the page.
OK. Set up your own head/head and try this in Firefox exactly as it is,
body
style
body {
background-color:#f4f9a8;
font-family:Times New Roman, Times, serif;
font-size:12px;
font-weight:normal;
color:black;
margin:0;
padding:0;
}
hr {
background-color:#dd;
color:#dd;
}
#container {
width:800px;
height:auto;
margin:0;
padding:0;
position:absolute;
top:0;
left:20px;
}
/style
div id=container
hr /
/div
/body
You'll notice that there are two color definitions for 'hr'. That's because
Firefox requires background-color to be set, and IE6/7 requires color to be
set. They are mutually exclusive and cause no problems.
In fact I believe that Mozilla are wrong. A hr is a printable line and is
therefore a foreground element and should possess color. By definition, how can
a background be placed on a background, or are they saying that hr possesses
its own z-index?
Regards,
Alan.
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus
__
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] Background in IE6 and 7
You're right, I did misunderstand the issue. Found one when where there were
two! g
As Alan says, add the background to the anchor like:
table.styledTable thead th a,
table.styledTable thead th a:link,
table.styledTable thead th a:visited,
table.styledTable thead th a:hover {
background: transparent url(bg.gif) center right no-repeat;
color: #99;
display: block;
text-decoration: none;
height: 100%;
width: auto;
padding-right: 15px;
}
You can see it working at: www.webbwize.co.uk/Test_Area/tabletest.html
Grab the code if you wish, after all, it is your code. I'll leave it there for
today.
BTW I only mentioned the transparency issues because you aksed about them in
the first place. :-)
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: Mark Finney
To: Alan K Baker
Sent: Saturday, April 05, 2008 4:46 PM
Subject: Re: [css-d] Background in IE6 and 7
I am afriad you have miss understood the issue. Your amendment doesn't fix it
it breaks it further as there is no directional arrow at all.
Look closely at the mark up and the css you will see that .header is a class
attached to a th NOT a tr.
The white space is therefore necessary. If it helps you to visualise it add
the th in like this:
/*
table.styledTable thead tr th.header {
background: transparent url(bg.gif) center right no-repeat;
text-align: left;
}
*/
Your amendment will stop the white overlaying the background - yes. But it
then displays the wrong background to the th, I specifically want two
bcakground images, one on the tr, one over the top of it on the th. View the
original in FF you will see there is a directional arrow over the top of the
gradient.
I know there are img transparency issues with IE, but this is not about img
transparency. it is about the background-color: transparent; inconsistencies I
am getting ...
__
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] centering divs within divs / jumping columns
I agree. (Not about the 'brightest star'!!! g). It works fine in IE6, IE7, Firefox, Opera and Safari, apart from Firefox rendering the footer with more height than you intended. Could it be that your browser didn't refresh after you tried it when it was wrong? 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: David Laakso To: Stuart King Cc: css discuss Sent: Friday, April 04, 2008 5:44 AM Subject: Re: [css-d] centering divs within divs / jumping columns Stuart King wrote: I am still having trouble. How do I get the footer down underneath the wrapper. The height of the body should be 412 px with the footer (CONTINUUM) directly below. URL http://www.triviumwine.com/continuum_site/pages/vision.html thanks. --s I am not the brightest star in the sky so I may be missing something that is obvious. But on this end, it appears that it is rendering as anticipated. If you want to keep the text from heading toward South America with user discretion to scale fonts, then there may be some question... __ 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] Background in IE6 and 7
IE 6 can't render .png files with alpha transparency properly. It displays the transparent part as white. Easiest way round that one is to replace the .png with a .gif. I can't think why there should be a problem with IE7 as the .png bug is fixed in e versions of IE7. 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: Mark Finney To: CSS Mailing List Sent: Friday, April 04, 2008 9:54 AM Subject: [css-d] Background in IE6 and 7 Dear List, I have a table theading (theadtrth) which has a background image set on the tr. I also have a small arrow image set as a background image to a link in each th to indicate the direction of sort. In FF all works as expected, however in IE6+7 oon XP (all I have tested thus far) the th has a white bg which hides the tr background. I haven't found anything written on this yet, anybody know how I can make that th background transparent? Or any articles about this? The arrow image is set like this: background: transparent url(../images/arrow.png) right center no-repeat; Thanks, 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-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] Anchor tags
Hi. Thanks for the reply.
I had started to think along these lines, but not actually worked it out. :-)
I've tried what you suggest and it works fine in IE7, Firefox, Opera and
Safari, however it refuses to work in IE 6. Any ideas?
Here's the code:
htmlbody!-- . Some stuff. --
div id=selectablea href=scripts/welcome.html/a/div
!-- As a temporary measure for IE6 --
!--[if lte IE 6]div id=clickentera href=scripts/welcome.htmlPlease
click here to enter/a/div![endif]--
/body/html
/* CSS */
#selectable a {
background-image: url(../images/logos/trans1px.gif);
width: 100%;
height:100%;
display: block;
z-index: 1;
position:absolute;
bottom:0;
}
selectable a:hover {
background-image: url(../images/logos/trans1px.gif);
}
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: Alan Gresley
To: Alan K Baker
Cc: css-d@lists.css-discuss.org
Sent: Friday, April 04, 2008 6:15 AM
Subject: Re: [css-d] Anchor tags
Alan K Baker wrote:
Hi all.
I have a need for an entire index page to be contained within an anchor, so
that anyone visiting the site would have to simply click anywhere within the
page to bring up the next screen.
As a tags can't contain divs , does anyone have a technique to achieve
this?
Regards,
Alan.
At the end of you source code insert a anchor within a container that
has no position whatsoever. Then style this anchor with.
a.selectable {
width: 100%;
height:100%;
display: block;
z-index: 1;
position: absolute;
bottom:0;
}
And for all versions of IE use this.
a.selectable:hover {
background-image: url(transparent-1by1px.png);
}
If the page is higher than the viewpoint you may wish to have it
position fixed for the better browsers.
Alan
http://css-class.com/test/
__
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] Conceptual problems with the doctype
- Original Message - From: Rachel Mawhood To: css-d@lists.css-discuss.org Sent: Friday, April 04, 2008 8:17 PM Subject: [css-d] Conceptual problems with the doctype Hello Validating the html on a site built this week, and the only remaining uncorrected error is to do with the doctype. I don't understand the instruction: I tried putting in the line the validator says is missing but that produced a new error. At the moment I have !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; If I have to add html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en where does it go, and doesn't that mean two closing /html tags at the foot of the page instead of the normal one? URL, if needed (this is the development area - there is a temporary page on the client's domain www.egg-skelter.co.uk) http://www.longitude0.co.uk/egg-skelter/development/index.php TVIA Rachel On two lines like this: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; head will work fine. Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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] IE6 and IE7 on the same machine
- Original Message - From: Ben Fider To: Katherine Coynor Cc: css-d@lists.css-discuss.org Sent: Friday, April 04, 2008 8:11 PM Subject: Re: [css-d] IE6 and IE7 on the same machine works fine for me, all day long: This contains everything except IE 7: http://tredosoft.com/Multiple_IE This contains IE 7: http://tredosoft.com/IE7_standalone Yes it does. I also use it all day long. One word of warning. When you install it, make sure that nothing else is running. It screwed up my network connections, because I forgot and left IE7 running. A tweak and a re-boot eventually fixed it. :-) Regards, Alan. www.theatreorgans.co.uk www.virtualtheatreorgans.com Admin: ConnArtistes, UKShopsmiths, 2nd Touch A-P groups Shopsmith 520 + bits Flatulus Antiquitus __ 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/
