CSS borders interfering with absolute positioning

Question

[edit: clarified that box-sizing: border-box doesn\'t seem applicable, since I\'m using absolute positioning]

The following code illustrates my problem. I\'m using absol

Answer 1

Six years later...

The other answers didn't work for my situation since the box I was styling already had a box-shadow. I needed a border on just one side like border-left and a border-radius, but without the border affecting the position or width of the element. The solution I came up with was to apply the border on an inner element of the absolutely positioned element.

.outer {
  position: absolute;
  width: 200px;
  height: 100px;
  border-radius: 5px;
  background-color: #c8c8c8;
}

.inner {
    height: 100%;
    min-height: 100%;
    min-width: 100%;
    width: 100%;
    border-left: solid 5px #097fee;
    border-radius: 5px;
}

  

    Some content