I want to add side images to my html page. On the entire left and right side of the page I want a image repeating vertically (different for each side).
How do I go about doing it?
samw1 1 Newbie Poster
Lusiphur 185 Practically a Posting Shark Team Colleague Featured Poster
Simply because there's a few different ways you can accomplish this in CSS I'll toss you this link here to a search where the top 3-4 results should be able to help you through that.
Hope this helps :) Please remember to mark as solved once your issue has been resolved.
samw1 1 Newbie Poster
I'm referring to this thing:
http://www.pmob.co.uk/pob/side-borders.htm
Problem is that the code completely breaks my layout.
(I'll edit my code here soon.)
samw1 1 Newbie Poster
<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #1280d5;
margin: 0;
padding: 0;
color: #000;
}
/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.container {
width: 80%;
max-width: 905px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
background: #1280d5;
margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
}
.outerx2{
padding-left:100px;
background: url(images/Light_02.jpg) repeat-y left top;
}
.innerx2{
background:#d2da9c url(images/ragged-left.gif) repeat-y right top;
padding:1em 1em 1em 0;
}
/* mac hide \*/
* html .innerx2{height:1%}
/* force "layout" in IE */
.outerx2 p{padding:0 10px;margin:0 0 1em 0}
</style><!--[if lte IE 7]>
<style>
.content { margin-right: -1px; } /* this 1px negative margin can be placed on any of the columns in this layout with the same corrective effect. */
ul.nav a { zoom: 1; } /* the zoom property gives IE the hasLayout trigger it needs to correct extra whiltespace between the links */
</style>
<![endif]--></head>
<body>
<div class="outerx2">
<div class="container">
<!-- Content Here -->
</div>
</div>
</body>
</html>I edited out unnecessary info.
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.