Border Not right in FireFox - Post ID...

User 2699991 Photo


Registered User
4,782 posts

Hi Everybody from sunny Bali
Perhaps this is a question more suited to the CC support team, but will try here first

Here Goes

I have a problem with the borders displaying incorrectly in firefox

In RLMP i put the border on the element

as per normal (a 4 px groove with a fairly dark colour)

the css looks like this:-

.placeholder.small-hero-1 {
border-top: 3px groove #4d434d;
border-right: 3px groove #4d434d;
border-bottom: 4px groove #4d434d;
border-left: 3px groove #4d434d;
background-color: rgba(255, 255, 255, .01);
}

.placeholder-hero.hero-unit-1 {
border-bottom:groove #4d434d ;
}
Displays fine on all browsers except firefox

Can't seem to find an answer anywhere (perhaps there isn't one
but it would be nice to know if there is someone who can suggest what to do and how to do it

thanks in anticipation

Wayan


Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2484360 Photo


Registered User
3,293 posts

Hello!

I show you have a 4px groove on the bottom border and a 3px on all the other sides. Could that be the issue here?

As to what it actually could be, we really need to see it in action to be able to provide an accurate answer. Can you share the link, or project file?
User 2699991 Photo


Registered User
4,782 posts

Hi adam
Go to www.thorgarage.com
Click english as language

Look at border around menu buttons and as underline in title,
In opera google edge the borders are a subtle grey
In firefox they are a very light grey and ddont seem to have the ridge effect

All borders are same size on that page
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2484360 Photo


Registered User
3,293 posts

Wayanjaya wrote:
Hi adam
Go to www.thorgarage.com
Click english as language

Look at border around menu buttons and as underline in title,
In opera google edge the borders are a subtle grey
In firefox they are a very light grey and ddont seem to have the ridge effect

All borders are same size on that page


They are the correct color, however the background color of the row renders a little lighter which causes the border to look lighter. You can confirm by removing the background color from each of the rows.

There really is not much that can be done to correct the issue, as it is on the browser side and I would also not worry about it as the border is showing the correct color, so at least it is not pink. :P
User 2699991 Photo


Registered User
4,782 posts

Hello Adam,

So are you saying that in a different firefox (maybe newer version) they look ok

I have attached a screenshot of how they look on my firefox browser
Attachments:
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2699991 Photo


Registered User
4,782 posts

looks like back to the drawing board then regarding borders

Ahhh well nothing else to do

Thanks for looking

Wayan
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I have viewed your site in 4 browsers. Ffx and Opera don't get that groove bit, that is the only difference I can see. Edge and Chrome are displaying it including the groove.

Another thing is, in all 4 browsers, when I mouse over the menu buttons, the one saying On-Line Shop makes a wee jump.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I experimented a bit...

Try this (and change the class name, colour and thickness to what you need):
css:
.borders {
border-bottom: 5px red;
border-top: 2px green;
border-right: 3px blue;
border-left: 6px orange;
border-style: groove;}


If you want the same thickness and colour on all sides, this is enough:
.borders {
border: 5px red;
border-style: groove;}


html:
<p class="borders">Here is some text...</p>
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2699991 Photo


Registered User
4,782 posts

thank you ingar
im changing the style
my client wanted groove and very subtle, he was very dissapointed that ffox didnt do it so now i am changing all borders

watch this space for when i have done it
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.