Sign in to follow this  

[web] html site border

This topic is 2641 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I've waited a few hours in irc channels and talking to folks trying to get a definitive answer, but it's been a waste of time. Simply, I wish to use an image along the left and right sides of my site but I'm having no such luck.


<div id="leftPillar" class="leftPillar">

</div>
<div id="rightPillar" class="rightPillar">

</div>


This is formatted by this css:


#leftPillar
{
background-image: url(../images/pillar.png);
background-repeat: repeat-y;
position: absolute;
left: 0px;
top: 0px;
text-decoration: none;
}
#rightPillar
{
background-image: url(../images/pillar.png);
background-repeat: repeat-y;
position: absolute;
right: 0px;
top: 0px;
text-decoration: none;
}



The image does not show at all for some unknown reason. Please help me

Share this post


Link to post
Share on other sites
Looks like you probably need to specify a width and height for your pillars. I assume height should be 100% and width would be the width of your PNG, like 15px.

Also I'd put "position: relative" on the body.

Additionally, if you don't want your pillars to move if your content goes beyond the bottom of the browser window, you might want to use position: fixed instead of absolute on your pillars.

Share this post


Link to post
Share on other sites
It depends on what styling you have on the site already but I guess you could try using the float attribute.

Something along these lines


<html>
<head>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
}
#leftcol {
background: #f00;
float: left;
width: 20px;
}
#content {
background: #fff;
float:left;
}
#rightcol {
background: #f00;
float: right;
width: 20px;
}
-->
</style>
</head>
<body>
<div id="leftcol">L</div>
<div id="content">Content</div>
<div id="rightcol">R</div>
</body>
</html>

Share this post


Link to post
Share on other sites
What I usually do is create one broad background to go into the body instead of making to separate pillars. This might not be the best solution, but it has worked well for my needs.

Share this post


Link to post
Share on other sites

This topic is 2641 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this