How do i implement an indented border
just wanted to know how i can change my navigation menu to have an indented effect. Like 1px of one light colour, and 1 px of darker colour.
Also does anybody know why i couldn't auto center the content in white,开发者_开发百科 i tried margin:0 auto; but had to code in a weird workaround.
soz, site is http://digitalgenesis.com.au/sites/1 Cheers Daz
You could probably use border-style: inset;
for the border effect you want, there's no need for nested block trickery or anything like that.
Your #infowrap
element won't auto-center with a simple margin: 0 auto;
because it is a block element and hence its default width is the width of its parent, this causes the auto
left and right margins to come out as zero. The margin: 0 auto;
will work if you wrap the insides in a block and give it an explicit width (for example: http://jsfiddle.net/ambiguous/aMemg/).
http://jsfiddle.net/jkmwy/
you can style the border left/right/top/bottom to create a bevel effect.
html
<div id="a"><div id="b">blah</div></div>
css
#b {
height: 200px;
text-align: center;
background-color: white;
border: 1px solid red;
line-height: 200px;
}
#a {
border: 1px solid yellow;
width: 300px;
}
body {
background-color: black;
}
精彩评论