Tiled image as background?

• 

  hatemailblog · Member · Mar 9, 2008 at 8:53 pm

  • Copy link
  • Add topic to favorites

  Hi I am using the Benevolence themd on my blog ( http://hatemailblog.wordpress.com ) and having some trouble setting an image as the background? Someone help me out! Thanks!

• 

  ellaella · Member · Mar 9, 2008 at 8:59 pm

  • Copy link

  Do you have the CSS upgrade?

• 

  hatemailblog · Member · Mar 9, 2008 at 9:33 pm

  • Copy link

  yes!

• 

  orbvab · Member · Mar 9, 2008 at 9:36 pm

  • Copy link

  Ask snowdobby, he uses custom css.
  http://snowdobby.com/

• 

  universalgeni · Member · Mar 9, 2008 at 9:44 pm

  • Copy link

  Well, it certainly is nice of you to help us out here in the threads, orbvb. Bloggers need advice from time to time…

• 

  orbvab · Member · Mar 9, 2008 at 9:54 pm

  • Copy link

  I’m a blogger

• 

  ellaella · Member · Mar 9, 2008 at 9:55 pm

  • Copy link

  @hatemailblog – You need to insert the full url of the image, which will tile, so look for this:

  body {
  	position: relative;
  	background: #333;
  	height: 100%;
  	font-family: Arial;
  	text-align:left;
  	color:#000;
  	font-size: 8pt;
  	margin:  0px;
  	padding: 0;
  	text-align: center;
  }

  And change it to this:

  body {
  	position:relative;
  	background:url('http://yourimage.xxx');
  	height:100%;
  	font-family:Arial;
  	color:#000;
  	font-size:8pt;
  	text-align:center;
  	margin:0;
  	padding:0;
  }

• 

  universalgeni · Member · Mar 9, 2008 at 10:11 pm

  • Copy link

  So am I, orbvab…

• 

  hatemailblog · Member · Mar 9, 2008 at 10:33 pm

  • Copy link

  That doesn’t work!! Here is the CSS I am currently using:

  #body {
  position:relative;
  background:#333;
  height:100%;
  font-family:Verdana;
  color:#000;
  font-size:8pt;
  text-align:center;
  margin:0;
  padding:0;
  }

  #wrapper {
  position:relative;
  height:100%;
  width:700px;
  border-left:10px solid black;
  border-right:10px solid black;
  background-color:#000;
  margin:0 auto;
  }

  #insideWrapper {
  position:relative;
  top:0;
  height:100%;
  width:700px;
  background-color:#fff;
  text-align:left;
  margin:0;
  }

  #insideWrapper:after {
  content:”.”;
  display:block;
  line-height:1px;
  font-size:1px;
  clear:both;
  }

  .post {
  position:relative;
  top:0;
  width:520px;
  left:0;
  background-color:#fff;
  text-align:left;
  overflow:hidden;
  margin:0;
  }

  #content {
  width:520px;
  margin-left:150px;
  background-color:#fff;
  text-align:left;
  }

  #sidebar {
  position:relative;
  float:left;
  width:80px;
  left:20px;
  background-color:#fff;
  text-align:left;
  font-family:Verdana;
  color:#000;
  font-size:7.5pt;
  line-height:11pt;
  text-transform:none;
  padding:0;
  }

  #sidebar p {
  text-transform:none;
  margin:4px 0;
  }

  .left {
  float:left;
  margin:0 10px;
  }

  .right {
  float:right;
  margin:0 10px;
  }

  #masthead {
  position:center;
  top:0;
  background:url(‘files/2008/03/blogheader2.jpg’);
  width:700px;
  height:225px;
  margin:0;
  }

  .centeredImage {
  text-align:center;
  margin-top:10px;
  margin-bottom:0;
  padding:0;
  }

  #footer {
  display:none;
  }

  .sep {
  position:relative;
  background:url(‘images/sep.jpg’);
  width:162px;
  height:14px;
  left:132px;
  text-align:center;
  margin:0;
  padding:0;
  }

  #sidebar a {
  color:#000;
  }

  #sidebar a:visited {
  color:#000;
  }

  #sidebar a:hover {
  color:#999;
  }

  .commentBox {
  position:relative;
  width:90%;
  background-color:#f5f5f5;
  text-align:left;
  border:1px solid #999;
  margin:0 auto;
  padding:5px;
  }

  .commentBox .avatar {
  border:1px solid #ccc;
  float:right;
  margin:0;
  padding:2px;
  }

  .cite {
  font-size:7pt;
  color:#666;
  }

  code {
  font-family:Courier New, Verdana;
  text-align:left;
  color:#666;
  font-size:8pt;
  }

  input {
  border:1px solid #333333;
  background-color:#FFFFFF;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:8pt;
  color:#000000;
  padding:0;
  }

  h2 {
  color:#666;
  font-size:14px;
  text-align:left;
  }

  #sidebar ul {
  margin-top:0;
  margin-left:0;
  margin-bottom:0;
  padding-left:0;
  }

  #sidebar li {
  list-style-type:none;
  margin-left:0;
  }

  blockquote,blockquote p {
  text-indent:0;
  margin-bottom:7px;
  color:#666;
  }

  .footerLink {
  display:none;
  }

  .title,#sidebar h2 {
  font-family:’Verdana’;
  color:#333;
  font-size:7.5pt;
  text-transform:none;
  font-weight:bold;
  margin:14px 0 0;
  }

  a.title {
  color:#000;
  }

  a.title:visited {
  color:#000;
  }

  a.title:hover {
  color:#000;
  border:0;
  }

  #blogTitle {
  position:relative;
  top:50px;
  left:20px;
  font-family:’Verdana’;
  font-size:8pt;
  text-transform:none;
  text-align:left;
  }

  #blogTitle a {
  color:#000;
  }

  #blogTitle a:visited {
  color:#000;
  }

  #blogTitle a:hover {
  color:#000;
  border:0;
  }

  .commentPos {
  display:none;
  }

  a.commentPos {
  font-family:’Verdana’;
  color:#000;
  }

  a.commentPos:visited {
  color:#000;
  }

  a.commentPos:hover {
  color:#000;
  border:0;
  }

  a {
  color:#000;
  text-decoration:none;
  }

  a:visited {
  color:000;
  text-decoration:none;
  }

  a:hover {
  color:#000;
  text-decoration:none;
  }

  #sidebar a img {
  border:0;
  }

  .entry-meta {
  display:none;
  }

  I edited it as you said and it didn’t change at all! Help!!!

• 

  ellaella · Member · Mar 9, 2008 at 11:15 pm

  • Copy link

  Remove the # from in front of the word ‘body’. Just change the background line.

• 

  orbvab · Member · Mar 9, 2008 at 11:17 pm

  • Copy link

  never mind universal

• 

  vivianpaige · Member · Mar 10, 2008 at 12:08 am

  • Copy link

  That was quite a rude statement, hatemail. After all, most of the people here in the forums are volunteers.

• 

  hatemailblog · Member · Mar 10, 2008 at 8:50 am

  • Copy link

  Sorry if it came across as rude – it wasn’t intended! Thanks ellaella and it works now! Hooray

• 

  ellaella · Member · Mar 10, 2008 at 10:59 am

  • Copy link

  You’re welcome. Glad it worked.

  /nod to Vivian