In these cases, you have two options.
If the available space is of a fixed width, you can simply add the value of each
component together to ensure that it matches the available width. For example, if
the available space is 500px wide, and you require an element to have 20px padding,
simply set the width to 460px and the padding to 20px for that element (20 + 460
+ 20 = 500). This solution assumes that the length values specified for the element??™s
box properties use the same unit of measurement, since you won??™t be able to add
together a mixture of units (200px + 10%, for example, makes no sense in this
context).
147 CSS Layout and Formatting
When the available content space has an unknown width??”as in the case of a fluid
layout??”this method can??™t be used, as percentages and pixels can??™t be added together.
In this case, the solution is to declare a width of 100% for the element concerned,
and to apply the padding, border, and margin values to a nested element instead.
That nested element has no width declaration, and can display the required padding,
borders, and margins without encroaching on the parent element.
Pages:
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225