Padding is moving div o/s fluid grid layout
After reading several posts, I am still no wiser to understanding why when I add padding to a text inside a div - it's moving the div outside the fluid grid layout.
I read one post that mentions I should add padding to the actual text using a new css rule, rather than adding the padding to the actual div itself - which I have tried to do, with no joy. The padding applied is still moving the div outside the fluid grid layout...
If anyone can point me in the right direction, I would very much appreciate it. Thank you.
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
.gridContainer {
width: 89.0217%;
max-width: 1232px;
padding-left: 0.4891%;
padding-right: 0.4891%;
margin: auto;
}
#header {
clear: both;
float: left;
margin-left: 0;
width: 100%;
display: block;
background-color: #EDEDED;
}
}
.phone-no {
font-family: "Roboto Bold";
font-size: xx-large;
text-align: right;
padding-right: 20px;
}
