10	17	25

Most made for dwstills's 12 Days of the Twelfth Doctor.

1	2	3	4	5
6	7	8	9	10
11	12	13	14	15
16	17	18	19	20
21	22	23	24	25
26

It's a miracle, I made headers again!
Huh, I could have sworn the was a field for a header in the layout-customization wizard. In that case you have to go to Custom CSS in every case. Element names in these CSS codes are for Flexible Squares. I don't know if the header image and other elements in other layouts have the same names, so you'll have to check or ask me to check a specific layout. Click the images for full resolution.

	.headerimage { height: 400px; width: 900px; margin: 0px auto; background: url(http://fatfrog.info/Ma/A/DW/Header/10x00Doctor-alloftimeandspace.png); }
	This was meant to be a header, but turned out slightly bigger than the resolution of an old monitor! I just couldn't make it smaller, because then the cross-hatching would have strobed even worse. Maybe some people don't mind scrolling past big headers? Alternatively some of the bottom could be cut off by reducing the height with this CSS: .headerimage { height: 500px; width: 843px; margin: 0px auto; background: url(http://fatfrog.info/Ma/A/DW/Header/10x01Bill-flowers.png) top; }
	Okay, this isn't exactly a header, but I didn't know how else to categorize its purpose, if there's even a name for it. Foreground picture? Layout hugger? Anyway, it shouldn't cover any content, as that would make links unclickable for example. The protrusion is 27px wide. Margin-left (which in this case starts from the center of the page) needs to be adjusted depending on the width of your content or whatever you put it next to. .headerimage { position: fixed; height: 247px; width: 182px; bottom: 0px; left: 50%; margin-left: 438px; background: url(http://fatfrog.info/Ma/A/DW/Header/10x08promo-DoctorBill-aroundcorner.png) top; } Well, you could use it next to the header, if you use the maincontent as the rest of the wall for the Doctor and Bill (or make the header as high as the image). This one's a bit more comlicated, more numbers for you to adjust. You need to - adjust margin-left by calculating header width minus half of the width of the header's parent element (in Flexible Squares it's #content) minus 27 (width of the protusion of the Doctor's hand and shadow), - adjust the headerimage's distance from the top, so its the right height next to the header, - give the header a background color/image or border, so there's a wall, and if you use the version with the maincontent - make the header as wide as the maincontent, - move the sidebar down until it starts where the image ends. .headerimage { position: absolute; height: 247px; width: 182px; top: 40px; left: 50%; margin-left: 208px; background: url(http://fatfrog.info/Ma/A/DW/Header/10x08promo-DoctorBill-aroundcorner.png) top; } #header { width: 685px; margin: 50px auto 0px 0px; } #sidebar { margin-top: 123px; }