Hello Guys,
I'm having trouble getting this to work properly.
I'm trying to create a pod, with a nice header on the top, which i can place text and an icon inside of.
I'm having alignment issues whenever i place text into the header.
Am i going about this correctly? You can see my example here.
This is the HTML and CSS i'm using.
Any advice you can give is greatly recieved.
Thanks,
Rob
I'm having trouble getting this to work properly.
I'm trying to create a pod, with a nice header on the top, which i can place text and an icon inside of.
I'm having alignment issues whenever i place text into the header.
Am i going about this correctly? You can see my example here.
This is the HTML and CSS i'm using.
Code:
<body>
<div class="pod">
<h2>Manage Your Users<span><img src="/redesign/images/icons/silkgif/folder_user.gif" alt="Manager Your Users" /></span></h2>
<div class="podcontent"></div>
</div>
</body>
.pod {
width:300px;
}
.podcontent {
height:300px;
border-right:1px solid #CCC;
border-left:1px solid #CCC;
border-bottom:1px solid #CCC;
}
.pod h2 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:normal;
width:100%;
background-image:url(../images/pods/header-left.png);
margin-bottom:0px;
padding-top:7px;
padding-left:7px;
display:block;
}
.pod h2 span {
height:30px;
width:32px;
float:right;
background-image:url(../images/pods/header-right.png);
}
.pod h2 img {
margin-top:7px;
margin-left:7px;
}Any advice you can give is greatly recieved.
Thanks,
Rob