Top

wbaraz2 on "Line in in my background? (link inside)"

February 14, 2010 by  

Hey guys, here is the theme I started with

http://www.themeblvd.com/demo/stylez/

If you’ll notice, it has repeating background image that is very hard to notice. Anyways, I wanted to change this image to my own background. I changed the picture in the css and here is my result

http://sportsremix.net/

It worked, but there is a line seperating the top and the bottom halves. Also, the bottom half is much more noticeable than the top half. Can anyone help me out? By the way, the image that I am repeating as background is main-bg.png. All the other .pngs are just there from the theme, not sure if they are affecting anything

Here is the css code that I think is relevant. If you need differnet code, let me know

/* MAIN ELEMENTS */

body {
	background: #151515 url('images/body-bg.png');
	color: #FFFFFF;
	font-style: normal;
	line-height: 140%;
	text-align: center;
	padding: 0;
	margin: 0;
	font: 13px 'Sansation Regular', tahoma;
	/* font: 13px Lucida Grande,Helvetica,Arial,Verdana,sans-serif; */
	letter-spacing: 0;
}

* {
	margin: 0;
	padding: 0;
}

.clear {
	clear: both;
}

a {
	color: #009cff;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.special {
	font-family: arial;
}

/* GENERAL TYPOGRAPHY */

p {
	margin: 10px 0;
	text-shadow: 1px 1px #000000;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: lighter;
}

small {
	font-size: 11px;
}

/* MAJOR LAYOUT ITEMS */

#wrapper {
	width: 998px;
	margin: 0 auto;
	text-align: left;
}

#header {
	background: url('images/header-bg.png') no-repeat top left;
	height: 96px;
	padding: 0 30px;
	position: relative;
}

#main {
	padding: 0 30px;
	background: url('images/main-bg.png') repeat-y;
	min-height: 500px;
	overflow: hidden;
	position: relative;
}

#main-top {
	clear: both;
	background: url('images/main-top.png') no-repeat;
	width: 998px;
	height: 2px;
}

#main-bottom {
	background: url('images/main-bottom.png') no-repeat;
	width: 998px;
	height: 2px;
	clear: both;
}

#left {
	float: left;
	width: 662px;
	margin: 0 8px 0 0;
	display: inline;
}

#left-pad {
	padding: 10px 10px;
}

#sidebar {
	float: left;
	width: 268px;
	display: inline;
}

#sidebar-pad {
	padding: 0 3px 25px 3px;
}
Share

Comments

Facebook comments:

Feel free to leave a comment...
and oh, if you want a pic to show with your comment, go get a gravatar!





*
Bottom