Solved

Padding Acting Like Margin

Posted on 2011-09-13
6
1,004 Views
Last Modified: 2012-05-12
I am having problems with using padding. When I apply it to my #content-right and #right its shifting everything like its a margin. Any ideas as to what is going on. I am using Joomla! 1.7 as a content management system.

http://www.cybernetiksolutions.com/cybernetiksolutions.com/
0
Comment
Question by:thebradnetwork
  • 3
  • 3
6 Comments
 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 36533451
That's what it does.  Here's the 'official' description: http://www.w3.org/TR/CSS2/box.html   When you specify a 'width', it is the width of the 'content' the innermost part of the HTML box model.  Padding, border, and margin are added to the outside.  The difference between padding and margin is that padding is inside the border and has the background color of the content.  Margin is outside the border and is transparent.
0
 
LVL 6

Author Comment

by:thebradnetwork
ID: 36533849
Let me try and explain this in more detail. I have specified a width of 65% or 650px for #content-right. When I add a padding:15px; its also like its adding 30px to the left and right equaling out to 680px. When I add the padding of 15px instead of taking the content and pushing the border in its expanding it. I hope that makes more since as to what problem I am having.
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 36534061
Apparently you didn't look at the link that I posted.  What you are describing is correct behavior.  Padding pushes the border Out because padding is Inside the border.  Nothing reduces the size of the content area, padding, borders, and margins are Added to the outside content.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 6

Author Comment

by:thebradnetwork
ID: 36534093
I did read the link you send. I still do not think that I am conveying my message. I will do an illustration of what I need to happen as to what is really happening. Also I was able to figure out the problem. Sometime I guess it helps to step away for a minute and then refocus. Thanks for your help.
boxdimeg.png
0
 
LVL 6

Author Comment

by:thebradnetwork
ID: 36534095
Ignore that illustration I attached. I didnt mean to attach it.
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 36534272
Do you have what you need now?
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
CSS Question 5 38
Apply tab index in forms 6 33
How to count in a table in php 22 0
Add image to into animation on website template 1 0
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

910 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now