2つのdiv要素が隣り合っているとします（https://chrome.google.com/webstore/category/home参考として境界線を付けます。
div が二重境界線のように見えないようにする方法 (できれば CSS トリック) はありますか? 私の言っていることをよりよく理解するために、次の画像を見てください。
2 つの div が交わる部分に二重の境界線があるように見えることがわかります。
ベストアンサー1
特定の順序で表示されることが保証されない要素 (1 行に 3 つの要素があり、その次に 2 つの要素がある行が続くなど) について話している場合は、コレクション内のすべての要素に配置できるものが必要です。このソリューションはそれをカバーする必要があります。
.collection {
/* these styles are optional here, you might not need/want them */
margin-top: -1px;
margin-left: -1px;
}
.collection .child {
outline: 1px solid; /* use instead of border */
margin-top: 1px;
margin-left: 1px;
}
アウトラインは機能しないことに注意してください古いブラウザの場合(IE7 以前)。
あるいは、境界線を維持し、負のマージンを使用することもできます。
.collection .child {
margin-top: -1px;
margin-left: -1px;
}