CODEWITHSUNDEEP
html
Stephen
Stephen

Reputation: 53

Div padding not following html

So basically I'm trying to move an item in my Div 400px to the right. I've added "padding-left:400px" to the source html, but every time i run the code as you can see in the picture it is going back to 42px, when i change that number in inspect element to 400 then it looks normal, is there any reason its doing this?

Inspect

Here is my code snippet of the div:

 <div class="content" style="border-bottom-width: 300px;margin-bottom: 0px;height: 430px !important;">
        <div class="footer-grids" style="
width: 1500px;
padding-left: 400px;
margin-top: 100px;

Upvotes: 3

Views: 212

Answers (3)

Jishnu V S
Jishnu V S

Reputation: 8407

There is no problem with your code , you have missing the closing div ,you need to check the div closing is right try with the below snippt , just inspect it

<div class="content" style="border-bottom-width: 300px;margin-bottom: 0px;height: 430px !important;">
	<div class="footer-grids" style="width: 1500px;padding-left: 400px;margin-top: 100px;"></div>
</div>

screenshot here

image here

Upvotes: 3

Nathanael Hooper
Nathanael Hooper

Reputation: 36

Try putting a !important after that padding-left, and if that fixes it, then there is something else in the code overriding it. Now you can keep it there but that's not really best practice, so if you want to fix it here's how.

In that case, go right click that 42px padding (after removing the !important to get it to return), and hit inspect and it should give you all of the attributes that make it up on the far right. Look through those for the 42px modifier and delete that, or just make sure your new one overrides it.

Upvotes: 2

Jay
Jay

Reputation: 86

It is because your browser not loading your css changes. Please Open Inspect Element after run your code in browser and Do Ctrl + Shift + R. It will refresh your browser and your code changes get affects.

And still its not load then keep use of !important after your style ex: style="padding-left:400px !important;"

Upvotes: 1

Related Questions