2017-05-23 1 views
1

테이블, 배경 색상과

<table style="background-color:grey; width:30px;"> 
 
    <tr style="background-color:red;"> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
    <tr style="background-color:red;"> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
    <tr> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
</table>

테두리를 라운딩은 다른 배경 색상을 사용하여 적절한 경계 CSS로 수행하지만,하지 않습니다.

충분히 확장하지 않으면 빨간색 셀 사이의 회색 색상이 결국 사라집니다 (반올림 (픽셀은 모니터가 표시 할 수있는만큼 작아서) 가정 된 웹 브라우저에서 처리하기 때문에). 나는 그것이 아마도 기능이 아니라 버그라는 것을 이해하지만, 나는이 가짜 테두리가 무엇이든 상관없이 표시되어야 할 필요가있다.

전체 웹 페이지의 버그는 동일하지만 IE (IE11, 문서 모드 I8 포함, 묻지 말아주세요)에서만 발생하며 텍스트 내용에 민감하지만 엉성한 필요 없음 ' 헤더 너비를 변경하는 테이블 내부 (하지만 JSFiddle로 제대로 재현 할 수는 없다. 단서 없음).

확대/축소가 < 인 경우에도 회색 선 (JSFiddle)을 표시하는 방법을 찾을 수 있다고 생각합니다 (IE에만 문제는 아니지만 Chrome 및 기타 문제 일 수 있음). 내 버그에 대한 해결책. 반올림 및 배경색 중첩과 관련된 브라우저 동작을 수정하는 방법이 있습니까?

답변

0

당신은 국경을 해제 할 수 있습니다 내가 명확히 할 수 있도록 그렇게 말씀 해주십시오 경우는 (어쩌면 내가 충분히 명확하지 않았다 내가 전혀 달성려고하지

table, th, td { 
 
    border: 1px solid grey; 
 
    border-spacing: 0; 
 
}
<table style="background-color:grey; width:30px;"> 
 
    <tr style="background-color:red; border-color:red;"> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
    <tr style="background-color:red;"> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
    <tr> 
 
    <td>eazeeza</td> 
 
    <td>eazeazeaaa</td> 
 
    <td>ezaadsqqsdqs</td> 
 
    </tr> 
 
</table>

+0

폭). 브라우저 확대/축소 수준이 낮을 때도 내 초기 스 니펫에 표시된 결과가 동일하게 유지되도록하고 싶습니다 (축소 수준을 낮추고 처음 두 행이 완전히 빨간색으로 표시됨). – Toto

+0

코드를 업데이트했습니다. 한번 봐주세요. –

+0

이것은 코드 샘플의 테두리가 배경색이 아닌 실제 테두리 (CSS 테두리 : 1px 솔리드 회색)로 얻으므로 문제를 우회하는 것과 같습니다. :) – Toto

관련 문제