Remove white space below image
You're seeing the space for descenders (the bits that hang off the bottom of 'y' and 'p') because img
is an inline element by default. This removes the gap:
.youtube-thumb img { display: block; }
Remove whitespace from left and right of resized image
"The requirement is that the image should scale to fit the available height while maintaining aspect ratio" - that's what it does in your code! If you would stretch the width ("to fill the whitespace"), either you would loose the aspect ratio and get a distorteded image, or - if the ratio is kept - the top and bottom of the image would be cut off since it would grow due to the extended width.
There is no other solution: Either there is some whitespace, or some of the image is cut off, or the image is distorted. Unless you change the dimensions of the parent container:
The only situation where your wish could be fulfilled: When the parent of the image has the same height/width proportion as the original image. So you would have to set height and width for the container accoring to the proportions of the image.
How do I remove white space from around a body background image?
Just remove the border
classname on the first div child of body. This adds a 1px solid border by default.
It's working even without your margin and padding set to 0!important in body since you have a _reboot css that already resets the body to margin 0.
Remove white space from an image using python
The code is almost perfect. It just can't crop on the right side because of the scrollbar. And it does not consider some padding (which you liked according the comments).
The thing I removed is the topology modification.
import numpy as np
import cv2
img = cv2.imread('cropwhitefromimage.png')
scrollbarright = 20
img = img[:, :-scrollbarright]
gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)
gray = 255*(gray < 128).astype(np.uint8)
coords = cv2.findNonZero(gray)
x, y, w, h = cv2.boundingRect(coords)
padding = 10
rect = img[y-padding:y+h+padding, x-padding:x+w+padding]
cv2.imshow("Cropped", rect)
cv2.waitKey(0)
cv2.destroyAllWindows()
cv2.imwrite("cropwhitefromimage_result.png", rect)
Removing white space from image on webpage
I think I found the issue, my link styling was creating the unnecessary space, so I just removed that and it works, I didn't need to add any extra code.
Related Topics
How to Set Space Between Contained Divs
How to Align Two Submit Button on Same Line
Align Text At Same Horizontal Align as Image
How Change Text and Color of Button Browse of Input File
How to Display Dynamic Json Data in HTML Using Angular 6
When Div With Absolute Position Is Added Cannot Click on Links
Styling an Input Type="File" Button
How to Show Google.Com in an Iframe
Flex Property Not Working in Ie
Multiple Span Tags Under a Div Add Extra Spaces
How to Remove Outline in Bootstrap 4
How to Clear Input Field After Submitting Data in Angular
How to Prevent Line-Break in a Column of a Table Cell (Not a Single Cell)
How to Rotate the Block Every Time You Click on the Button
Angular: *Ngif Tag on Input Element Causes It to Be Undefined. Cannot Read Value from Input Field