Image borders

[bethmme]

My board default is no image borders, but sometimes I do want a border on a particular image to better separate it from the post text.  I tried just adding the hr above instead but that isn't very satisfactory.

I tried editing the image link in the post by inserting a style code, but it didn't work.  I have used other image style codes successfully, for example I insert style="max-width:80%;" quite often.  I had no luck with this one:

style=”border:5px solid #000000; padding:3px; margin:5px”

Anyone have any better ideas?  My next resort would be to download the image, edit it add a border to the photo itself, then upload it somewhere, which seems a less than optimal solution.

[bethmme]

I think I solved this myself. I tried a different way of defining border style and it seems to have worked.

img style="max-width:90%;border:orange;border-width:5px;border-style:solid;" src="https://***" alt=" " (inserting the image URL in place of the *** ellipsis)

The only issue with this is the board image display doesn't consider the extra space used by the border when calculating full width so the image ran off the right edge of the display.  That's why it needs to be used in combination with the max-width style code. I think I could have gone up to 95 or more.

[Chris]

1. Sept 22, 2022 12:27:58 GMT -8 bethmme said:

   My board default is no image borders, but sometimes I do want a border on a particular image to better separate it from the post text.  I tried just adding the hr above instead but that isn't very satisfactory.
   
   I tried editing the image link in the post by inserting a style code, but it didn't work.  I have used other image style codes successfully, for example I insert style="max-width:80%;" quite often.  I had no luck with this one:
   
   style=”border:5px solid #000000; padding:3px; margin:5px”
   
   Anyone have any better ideas?  My next resort would be to download the image, edit it add a border to the photo itself, then upload it somewhere, which seems a less than optimal solution.

   
   
   That definitely should have worked (the shorthand border property is supported). I do however see you are using some sort of fancy quotation marks rather than the required standard double or single quotes
   ”|"|'
   
   Try it using the standard quotation marks
   
   
   _{style="max-width:100%;border:5px solid #000000;padding:3px;margin:5px;"
   style="max-width:100%;border:5px solid #000000;padding:3px;margin:5px;border-image:linear-gradient(red, blue) 27 23 / 10px / .5rem space;"}
   
   
   
   
   

2. Sept 22, 2022 14:14:15 GMT -8 bethmme said:

   The only issue with this is the board image display doesn't consider the extra space used by the border when calculating full width so the image ran off the right edge of the display.

   
   
   No forum URL was given so that the box-sizing currently being applied to your forum could be investigated.
   

[bethmme]

Apart from the plug-in for extra smilies, my board just uses the starting defaults for everything. I like the look of it, so I figured why fuss with it.

I'm pretty sure you are right about the slanted quotes being the problem. Thank you for helping.

[Chris]

Sept 23, 2022 11:32:47 GMT -8 bethmme said:

Apart from the plug-in for extra smilies, my board just uses the starting defaults for everything. I like the look of it, so I figured why fuss with it.

I'm pretty sure you are right about the slanted quotes being the problem. Thank you for helping.

As long as you are ok with it, then that is all that matters