Fixing margin(?) issue
Hey! so in image, you'll notice that the first Select (with the text "All" is more to the right due to the others having an X, which the first one doesn't need
I already attempted with an "::after"
it didn't help
I already tried putting a margin-left as well as padding-left on the X, it didn't help...
most efficient layout option
Hey, i'm wondering the most efficient way to layout the size of the image in this design on both screen sizes.
- on the mobile version, the image height is smaller than the height of the content below so would ya'll recommend something like a
grid-template-rows: .6fr 1fr; / grid-template-rows: 1fr 2fr; or not using grid or flexbox and just setting a min-height on the div containing it? But then i was thinking since it get's placed into a grid on desktop that the grid option would be better? But ultimately i'm not sure on the most beneficial approach for this sort of layout.
- on the desktop version, it's kind of the same question, would you recommend something like a grid-template-rows or height based solution for the ratio between the larger image and group of smaller ones underneath?...
CSS `image-rendering: pixelated;` works not as described in ~~docs~~
W3 states that using
pixelated value of CSS image-rendering property has effect only if image is upscaled. However, this is apparently not the case in Chromium and it does not work in Firefox too.
If the image is scaled down, it will be the same as auto — https://www.w3schools.com/cssref/css3_pr_image-rendering.php...
Can I hire a CSS guru to make a grid that respects vertical bounds?
I have built and rebuilt a css grid for a very specific purpose, however all my attempts don't satisfy all requirements and customers are nearing riot levels of disdain. I need to come up with something that actually works as expected.
Requirements:
- Grid items resize to fill all available container area (vertical and horizontal) without overflow.
- Grid container does not shrink below 600px wide....
HTML & CSS help
I am needing help, I am trying to create a special effect in HTML and CSS. Can anyone help me?
Tips on how to deal with the mascot possibly blocking the search or content below it?
Feel free to criticize and tell me what you think, I'll appreciate it.
I'm looking for ideas on how to deal with the mascot. I was going to add a scroll event listener to the window and make the hero
overflow: hidden; to hide it when the user starts going through the page, but that doesn't fix the search bar issue.
What would you do in my situation? Do you have a cooler approach to this? Thanks for checking my post!...
White space - no wrap issue
Mat table , table cell content gets hidden
Am trying to display a list of countries in a cell . Initially , I show 2 countries and on clicking 'View All' , will display rest of them . When I display rest of them , onlt the countries fit in cell are getting displayed .
I want the table cell height to unjust accrding to the content of the cell .
HTML :...
Image height
I'm probably being really stupid about this, but I have the following problem (see attached image)
It's just a simple image with object-fit: contain on it, but for whatever reason it keeps adding an insane amount of white space to the top and bottom. The amount of white space varies on each different image.
All I want it to do is stretch to fit the container, and take whatever height it needs to....
