Photoshop Question posted in
The official user guide can be found here.

How to make thick border OVER image without changing the image size – Photoshop

The problem is i need photoshop-like selection functionality. But when I add border to div that encloses the image, the image gets smaller by the thickness of the border x2.

How can i resolve that?

I tried, making

.picture-frame--image {
    border: 5px solid red;
  margin: -2px 0 0 -2px;
}
<div>
<img class="picture-frame--image" src="https://placehold.it/500x500">
</div>

<div>
<img src="https://placehold.it/500x500">
</div>

but the image is overlapping border, and i need otherwise. For some reason z-index won’t work, i dont know why.

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    Accualy the best answer was made by cimmanon in nathaniel link.

    I made:

    img {
  outline: 2px dashed violet;
  outline-offset: -2px;
}

    Thank you all for the answers. Really appreacie it.


  2. 0

    It sounds like you need to add

    * {
    box-sizing: border-box;
}

    to your css file. I’m not entirely sure though because you didn’t post any code.
    Check this site for more information: https://www.w3schools.com/css/css3_box-sizing.asp

    Login or Signup to reply.
  3. 0

    I think what you are looking for are pseudo elements like ::after and ::before. With these you can add content around your element. But beware that these can only be applied to certain html tags. ::after MDN Documentation

    See this StackBlitz

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search