PDA

View Full Version : Changing box margins?


COOLORANGEFREEZE
04-08-2009, 03:21 PM
I want to make a box smaller (left and right sides inward)

How would I write that in the following code -

<style type="text/css">
UL {background: #FFFFCC;
margin: 9px 9px 9px 9px;
padding: 2px 2px 2px 2px;}
LI {color: #336600;
background: #FFFFCC;
margin: 9px 9px 9px 9px;
padding: 9px 0px 9px 9px;
list-style: none}
LI.withborder {border-style: dashed;
border-width: medium;
border-color: #FFFFCC;}
</style>
</head>
<body>


I tried placing <hr style="margin-left:10%;margin-right:10%"> after padding but it didn't take.

Thanks
PremiereWebDesign
04-19-2009, 04:04 PM
I am not sure that I understand your question, but if you are asking how to create a box effect in your CSS, you can use the border property.
Example:


<style type="text/css">
UL {background: #FFFFCC;
margin: 9px 9px 9px 9px;
padding: 2px 2px 2px 2px;}
border: thin dotted #00FF00
LI {color: #336600;
background: #FFFFCC;
margin: 9px 9px 9px 9px;
padding: 9px 0px 9px 9px;
list-style: none}
LI.withborder {border-style: dashed;
border-width: medium;
border-color: #FFFFCC;}
</style>
</head>
<body>
For a good tutorial on this subject, you may want to visit http://www.w3schools.com/css/css_border.asp
COOLORANGEFREEZE
04-19-2009, 07:00 PM
Thanks for your response. I have the box in already. I copied the box code but I'm not sure how to bring the margins in. The box is too wide.

An even stranger thing, to me, is that I have two identical boxes made. But the lower box apparently rules both, lower and the upper, in color b.g. and size. So whatever color# I chose for the bottom then the upper will be the same color by default.

I'll PM the page link since I'm not ready for viewing yet if you'd like to see it.
wysiwyg
04-21-2009, 09:36 AM
If the box is too wide then you need to specify a width. The margin is just extra space around the box.
COOLORANGEFREEZE
04-21-2009, 12:43 PM
If the box is too wide then you need to specify a width. The margin is just extra space around the box.

Thanks. I'll give it a shot:cool: