not resolvedI would like to ask if i want to add something(like image or a line) in the area(red color box, see the image).
Image:
http://img454.imageshack.us/img454/3968/examplepw8.jpg
The line or the image will follow the content or sidebar height, which mean if the content or sidebar increase, the line or image will increase as well. Any idea to do this?
Thank YOu!
What I would do is modify this object in your core layout section of your style sheet: #content { width: 500px; padding: 0 0 0 20px; float: left; }
You can add a border-right: 2px; border-left: 2px; or what have you. The issue is that due to the padding value of 20px on the left the border will be pushed right up against your left column. If you want it more in the center try changing the padding to 9px, and then add a left margin of 9px. This will leave 2px of the 20px space currently there for your border. You can make a solid, dashed, or dotted border. You could even use a background image for that entire center section that repeats on the y axis so it continues down with whatever you put there. The bg image could simply be white area 500 px wide with your graphical borders on the side. It only needs to be about 5px tall and then you set it to "repeat-y".
So as you can see there's a few ways. Depends if you want just a line or more of a graphic. These solutions will adjust for the center content. See below for the borders to follow the content in the sidebars.
Similar approaches could be done to the border-right value of the #l_sidebar { width: 210px; padding: 0 0 0 15px; float: left; } and the border-left value of #sidebar { width: 210px; padding: 0 0 0 15px; float: right; }
You'd end up with: #sidebar { width: 210px; padding: 0 0 0 15px; float: right; border-left: 2px solid #000000; } (size, type, color)
Same thing for the other sidebar.
You could also change the background images of the sidebars to something if you want a more graphical border.
The issue here is going to be the fact that you will have to experiment with padding (distance between content within the sidebar and its border) and margins (distance between the border of the object and any other object)in order to get your borders in the right place.
Just make sure when you add your border width + padding value for left and right + margin value for left and right, it still equals 210 px (which is the width the sidebar is set at).
http://www.w3schools.com/css/css_background.asp for info on adjusting background images with CSS...
Examples of working with CSS borders: http://www.w3schools.com/css/css_border.asp
Examples of working with margin and padding:
http://www.w3schools.com/css/css_margin.asp
http://www.w3schools.com/css/css_padding.asp
o thx for the help. I go try 1st :)
the image backgroud can't show probably, especially the right hand side for the content part. the content overlap only will show the right hand side image... >.<" ...
now i change it to the content box background...
You must log in to post.
