Wed, 2007-06-20 09:16
I've run out of ideas on this one.... :?
Background:
I have a 6px ridge border surrounding several parts of the page. The colour I want is #BE88B4 (a sort of dusky pink). However I discovered by accident in IE6 that because it sits on a background of #663399 (med/dark violet) I have to use #FFB6F1 (lavender) to achieve the dusky pink.
Problem:
Draw a vertical ridge border of #FFB6F1 on a background of #663399 – notice the pink is on the left and a darker tint is on the right in IE6. In FF2 the pink is on the right and a much lighter hue is on the left!
Not a solution:
I tried picking up the darker tint on the right (IE) and using it as the border for FF thinking it would then throw the correct pink colour to the left, and I would have the colour I want in FF – however it all just turns a murky grey.
Any ideas how I can manipulate this so that I get the equivalent of #BE88B4 on the left in FF2 please?
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again 
Wed, 2007-06-20 09:22
#1
Could we have a link please
Could we have a link please 
Wed, 2007-06-20 09:32
#2
I wish I could Burlster -
I wish I could Burlster - unfortunately I don't have any way of putting the site up at the moment. 
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 09:34
#3
hi, your description is
hi,
your description is quite good, but its quite confusing also. i dont think i can help unless i see what you want to say... can u put up atleast 2 jpegs?
mihir.
Wed, 2007-06-20 09:44
#4
Just had that idea
Just had that idea myself...I hope this works
| Attachment | Size |
|---|---|
| IE_border.png | 2.98 KB |
| FF_border.png | 2.83 KB |
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 10:06
#5
A clearer snapshot I hope..
...tried a different part of the page - this might give you a clearer idea. Thanks for having a look.
| Attachment | Size |
|---|---|
| FFborder_v2.png | 8.28 KB |
| IEborder_v2.png | 8.45 KB |
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 10:20
#6
Could you post just the bit
Could you post just the bit of CSS code up where you've defined the colours?
Thank you
Wed, 2007-06-20 10:27
#7
Okay this is the main
Okay this is the main container bit...
#container
{
position: relative;
background-image: url("images/viojewel140_2.gif");
background-repeat: repeat-y;
margin: 0 13%;
border: 6px ridge #ffb6f1;
}
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 11:57
#8
IE and FF render ridge,
IE and FF render ridge, inset and outset differently. there is no way around it.
However, you could, perhaps (if it is important enough) sit one div on top of another slighly bigger one and encase each with 3px borders of slighly different colours. Clumsy, but it should work.
Wed, 2007-06-20 11:59
#9
Although I do realise that
Although I do realise that it may be a requirement of your design, it is still worth noting that chasing after cross browser perfection is not considered a sensible game and one just has to except at times that there are differences and bugs that occur that make this impossible and that no one but us compares between two different browsers.
You simply can't do anything about miss-handling of borders; transparent, double or dotted, outset, inset etc one could go on and on listing all the problems.
Wed, 2007-06-20 12:27
#10
Phreestyle wrote:IE and FF
Phreestyle wrote:
IE and FF render ridge, inset and outset differently. there is no way around it.
Yes, I had a feeling someone might say that 
Quote:
However, you could, perhaps (if it is important enough) sit one div on top of another slighly bigger one and encase each with 3px borders of slighly different colours. Clumsy, but it should work.
Eerm...I think I've got a few too many ducks to get in a row before I attempt this sort of thing, but I appreciate the suggestion - thanks Phreestyle.
Hugo wrote:
Although I do realise that it may be a requirement of your design,...
I put the ridge border in because it seemed to "finish" things a little more and has come in quite handy on another page (I've got 3 laid out because they have different requirements due to the content).
Quote:
...it is still worth noting that chasing after cross browser perfection is not considered a sensible game and one just has to except at times that there are differences and bugs that occur that make this impossible and that no one but us compares between two different browsers.
Oh! How true However realising the limitations of this particular instance, I was hoping to find a way of getting a similar colour to the one I wanted (#BE88B4 in it's true state) that would render in a similar colour for both major(?) browsers. As they are, they're like chalk and cheese and simply won't do at all
Oh well...put that one on the back-burner and maybe the answer will turn up by the time I'm up to page xx when I'll probably have to make the decision to ditch it!
Thank you to everyone who chipped in here, I really do appreciate it.
Vicki
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 12:38
#11
If a fixed design, no sneaky
If a fixed design, no sneaky ways of having the border as a repeating background image in a new container with actual border images for the top and bottom set with margins to sit tightly against the top and bottom respectively? Do you know what I mean or do I make no sense?
John
Wed, 2007-06-20 12:57
#12
Quote:Do you know what I
Quote:
Do you know what I mean or do I make no sense?
Weeeell...it isn't easy but I think I get the gist of what you're saying - unfortunately it would simply be too difficult because I have used it around divs/ids on the other pages in the "content" box as well as around the bits you see in the snapshots - so there are simply too many bits to cover with this sort of idea.
But many thanks for bending your brain to it for me!
Vicki
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again
Wed, 2007-06-20 13:12
#13
This is what you need. The
This is what you need.
The 'rendering-intent' property.
Just got to wait for CSS3 and you'll be sorted.
Wed, 2007-06-20 13:17
#14
The way it's going, we'll
:thumbsup:
The way it's going, we'll be anticipating CSS4 by the time I'm sorted!!
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again