How to get rid of of those lines going beyond the pictures? - html

My own website, I've done on the left side, menu bar and on the right side, three pictures stack below each other, with the white space in between.When I did box-shadow on all of the pictures suddenly the padding line began to show up as well. How to remove that? How to do to keep box-shadow only across the picture measurement?

Related

Why do I have this right white space on my website?

I am currently learning web design, and I have made a little Site for a friend of mine.
I have a white box on the right side along the whole screen, which pushes my contend to the left. Seems like a padding, or a margin, or something. But I can't find the Problem?
Its in the responsive view also!
Image of responsive view:
The Site is online at https://tastenwichser24.de/.
Seems you are doing sliding animations and it overflowed. In line 178 <section> tag try adding a overflow-x:hidden.

On iPhone Website Zooms Out When Clicking Dropdown?

I am having an issue with a site I am developing on iPhones. When I click a select element on my phone it zooms the website out and adds white space to the right side of the screen.
This only occurs when I click one of the two dropdowns that are on the right side of the screenshot (Industries or Category). While if I click a dropdown on the left side (Services, or Companies) It doesn't add the white space to the left of the screen.
I can't seem to figure out what is causing this issue?
EDIT: A little harder to see in the screenshot, but the blue filters block should be all the way to the right size of the screen, but white space is added to the right side when a dropdown is selected.

i am trying to make these 2 top images the same space between them

I am one of the developers for this website which i have been assigned on
i have been trying to make spaces between these 2 top images like the 2 bottom images. i have used padding and margin but its not working
https://www.eliquidsnow.co.uk/pages/testing
when i use margin-right: it brings it closer but it dosent do the right space like the bottom 2 images. with padding it makes the images smaller i even tried putting white border line but it messes it up.
from the inspector it looks like if you apply, margin-left: 30px; to the second .one-third-column you can have the same space as at the bottom section

Nav with two dynamic elements + border of first

I've made an Image of what I want to archieve.
The logo resizes on different screen resolutions and the actual navigation container is just as long as the <li>'s.
The bottom border needs to reach to the lower left edge of the logo.
The logo itself has a shadow below, so the border cant be full width.
What I've got so far is that the nav itself has a border which then only reaches to the last <li>
This is a quick mockup:
http://jsfiddle.net/2x6hddv8/
Here's most of it -- they just called my flight!
http://jsfiddle.net/8k45z7nL/
I'd avoid the skew for maximum browser compatibility.

White gap and break in Apple-style CSS spritesheet menu

Please see http://shivimpanim.org/testsite/
It is very simple css, and my goal is to essentially duplicate Apple's menubar
Strangely- I'm getting a white gap between several of the buttons, and the last button is breaking onto the next line!
For right now, I've eliminated the dividers in the graphic to be sure that it's definitely an html/css error and not the divider I'm seeing.
Please help :)
Thanks!
I am afraid I don't see the white gaps you are talking about in Firefox 5 or IE8 (which browser are you using?). However the reason the last <li> is dropping to the next line is because your button widths are too wide for the container.
Your <ul> is 960px wide, but the sum of your individual <li> widths is 970px. So if you reduce a few of your <li> items down by a total of 10px it will all fit in.