function facultywebsites_custom_background() {
	add_theme_support( 'custom-background', array(
		'default-color' => '043d5f',
		'default-image' => get_stylesheet_directory_uri() . '/images/bg-master-fade.png',
		'repeat' => 'repeat-x',
	) );
}
add_action( 'after_setup_theme', 'facultywebsites_custom_background' );

background:url(‘images/pasek.png’) 0% 0% repeat-x scroll;
background-size: 2560px 2113px;
margin:0;
padding:0;

I’d like this image to fill the whole backround – from the top to the bottom of the page regardless of page content and browser type.
In Firefox it remains longer than in IE.

Does anyone knows how to manage it?
Thanks in advance!

My CSS knowledge basically consists of copy-pasting stuff I find on these support forums onto my site. I put this code into my child theme style.css, to show a background image in the theme:

body {background: url(images/headerbg2.png) repeat-x;}

It works in Firefox:

https://dl.dropbox.com/u/51767121/Problem%20with%20bg%20image/Untitled-2.png

But not in Chrome, where sometimes the background image is cut off:

https://dl.dropbox.com/u/51767121/Problem%20with%20bg%20image/Untitled-1.png

The image is 1px x 180px and repeats full width in the body of the page. But something seems to be cutting it off in Chrome. Sometimes it works as it should in Chrome, but if you refresh the page it will display incorrectly again.

I designed the theme in Photoshop and thought that translating it into Twentyten would be simple, but may have to give up at this rate.

If you will notice the grey menu bar and how it repeats left and right out into infinity, i want to cut that and have it just start and finish with the first and last button respectively.

Also beneath the menu there is a space before the slider. i want to either move the slider up or add a white background to everything under the menu so as to visually hide that space as tho its not there. Same issue below the slider.

I really hope u can help, it has been driving me crazy, but im just too tired to think about it anymore.

I am trying to make header image repeat horizontally repeat-x in Cutline theme here are the required codes:

Header.php

<div id="header_img">
		<img src="<?php header_image() ?>" width="970" height="55" alt="" />
		</div>

Styless.css

#header_img { position: relative; margin: 0 0 3.0em 0; border-bottom: 1px solid #000; float: left; clear: both; }

	#header_img img { display: block; } /* this is really just an IE 6 and 7 hack in disguise */

function.php

<?php

$themecolors = array(
	'bg' => 'ffffff',
	'text' => '000000',
	'link' => '0060ff'
);

// No CSS, just IMG call

define('HEADER_TEXTCOLOR', '');
define('HEADER_IMAGE', '%s/images/header.gif'); // %s is theme dir uri
define('HEADER_IMAGE_WIDTH', 970);
define('HEADER_IMAGE_HEIGHT', 55);
define( 'NO_HEADER_TEXT', true );

function cutline_admin_header_style() {
?>
<style type="text/css">
#headimg {
	height: <?php echo HEADER_IMAGE_HEIGHT; ?>px;
	width: <?php echo HEADER_IMAGE_WIDTH; ?>px;
}

#headimg h1, #headimg #desc {
	display: none;
}

</style>

what changes i have to make in order to make header image repeat-x

Thanks for ur help.

Best Regards

website: https://www.frankmembreno.com/blog

Trying to help my wife out with her blog, and I’ve never actually tried to use a repeating background image before: we’ve got a vertical image that we’d like to “loop” to the left and right of the central blog area, running in a strip down either side of the blog but not necessarily repeating out to the far sides of the screen.

At the moment, I have

body {
	margin: 0;
	padding: 0;
	background: #FFF url('images/applemirror.jpg');
	background-repeat: repeat-y;
	font-size: 80%;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, sans-serif;
	color: #000;
	text-align: center;

which causes the banner to run up the left side of the blog area, but not the right side. Adding repeat-x to the background-repeat makes it repeat, but starting from the far left, then with an ugly half-repeat before it gets to the blog area, and it runs “under” the blog to repeat on the other side with more ugly dividers.

Ideally, I’d like the image to repeat once to the left and once to the right of the blog space, using repeat-y for up and down but nothing repeating on the X axis.

I’ve tried searching these forums but I’m obviously not using the right terms. Thanks for any help!

Look closely at https://totalphysiqueonline.com/2006/12/14/dave-drapers-thoughts-on-fitness/

Scroll down the page and you will see that the background for the page and the entry block stop abruptly. Why is that?

The entry block in my css is this:

.entry{

position:relative;

margin:0 0 20px 0;

border:2px solid #fff;

background:#eee url(images/entrybg.png) repeat-x;

color:#333;

padding:10px 10px 0 10px;

}

and for the body it is this:

body{

margin:0;

padding:0;

font:76% tahoma,verdana,sans-serif;

background:#e6e6e6 url(images/bodybg.png) repeat-x;

color:#333;

text-align:center;

}

As you can see, repeat-x is there. Why then the abrupt end to the backgrounds?

PS: NOTE- only Safari truncates both backgrounds. Firefox and Opera truncate ONLY the entry body background. The main Body bg works as it is expected to work in both of those browsers.