Den här webbplatsen har begränsad funktionalitet medan vi utför underhåll för att förbättra din upplevelse. Om en artikel inte löser ditt problem och du vill ställa en fråga har vi vår gemenskap som väntar på att hjälpa dig på @FirefoxSupport på Twitter, /r/firefox på Reddit.

Sök i support

Akta dig för supportbedrägerier: Vi kommer aldrig att be dig att ringa eller skicka ett sms till ett telefonnummer eller dela personlig information. Rapportera misstänkt aktivitet med alternativet "Rapportera missbruk".

Läs mer

Border and Outline are overlapping

  • 5 svar
  • 1 har detta problem
  • 7 visningar
  • Senaste svar av cor-el

more options

In my MTML code I have in the style section

   .RB td  {outline:medium solid red;border:10px solid white;}

According to the definitions the outside of the table cell should be red and the inside should be white. However, the border seems to be on both sides of the outline. To see what is happening look at https://freedom-press-alliance.us/ For what it is worth, Edge has the same problem.

In my MTML code I have in the style section .RB td {outline:medium solid red;border:10px solid white;} According to the definitions the outside of the table cell should be red and the inside should be white. However, the border seems to be on both sides of the outline. To see what is happening look at https://freedom-press-alliance.us/ For what it is worth, Edge has the same problem.

Alla svar (5)

more options
more options

Stack overflow is seldom useful. This is a case of the website not doing what the CSS documentation said it should. stack overflow is to help with HTML, CSS, JAVASCRIPT coding errors, not browser errors. PS. I need my email address changed to hmorris@southwest.tn.edu

more options

The outline isn't allocated it's own space (see outline on MDN). In this case, it is being drawn "in" the border.

Col_Boogie said

Stack overflow is seldom useful.

Oh, I don't know, I picked up a trick there:

.RB td {
  border:4px solid red;
  position:relative;
}
/* Generated content trick */
.RB td:before {
  border:6px solid white; 
  position:absolute; display:block; content:''; left: 1px; top:1px;
  height:100%; width:100%; 
  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
}
.RB td a {
  margin:6px;
}
more options

Actually, hold on, that creates an attractive inner border but it blocks the link. Maybe you're stuck with one border color, or using a two-color border image.

more options