Back to: Blog

Wallpaper WordPress Style

I’ve released a new WordPress style: Wallpaper (Download)

Like all the styles on that page, this stylesheet works with the default ‘index.php’ template in WordPress, no editing of the template is required (other than the changing the name of the CSS).

I’ve tested this on IE 6, IE 5.5, IE 5, Mozilla, Camino, Firefox and Safari and it looks fine. I also checked it in Opera, but it is a little off there. Apologies to both of you Opera users.

Popularity: 7% [?]

Posted August 24th, 2004 @ 11:04 AM

19 Replies

OF Jay adds this Comment:

Clear: right, Float: left and position: relative for the menu div? First time I’ve seen that technique to pull off a two-column layout a la Cederholm. Could this be the end of all clearing divs for this kind of layout?

August 25th, 2004 at 9:22 am
Alex adds this Comment:

The position: relative; and left: Xpx; is only needed for IE 5.0 (maybe 5.5?). Otherwise just float and clear will do the job 90% of the time.

August 25th, 2004 at 9:25 am
OF Jay adds this Comment:

I just noticed that #content is also floating. Does float:right for the menu basically eliminate the need for a huge margin:left rule for #menu to overcome any flow-around issues if the content is shorter than the menu? (I still use margin:left to tame the menu div in mine.)

August 25th, 2004 at 9:28 am
Alex adds this Comment:

I think you mean ‘clear: right;’ and yes, that clears floats to the right side. I find that doing it on the top element and the element below (clear: left; or clear: both;) makes for better compatibility w/ IE.

August 25th, 2004 at 9:31 am
David adds this Comment:

What would be the easiest and safest way to center this style? Is it possible, Alex? I –as many others– like centered things….

August 27th, 2004 at 5:29 am
Alex adds this Comment:

You can’t center it and keep all the effects (and make it work cross-browser). There would need to be additional markup in index.php.

August 27th, 2004 at 10:38 am
OF Jay adds this Comment:

Won’t adding the rules:

margin: 0 auto 0 auto;

to #rap center the layout?

August 27th, 2004 at 1:20 pm
Alex adds this Comment:

You’re welcome to experiment and report back with a solution.

Keep in mind that the solution must work in all the browsers I tested in.

August 27th, 2004 at 1:26 pm
Kevin LaCoste adds this Comment:

Thanks for the style archive and the plugin Alex. This is really a great resource for us WP newbies! I think my blog is about to get a make over.

August 29th, 2004 at 10:41 am
ZenVilla Blog adds this Trackback:

Now With Style
I spent some time playing with Alex King’s WP Style Switcher plugin this evening. The result is there in the navigation menu, a section called styles. Click an item in that list and this site will get a fresh coat of paint. Very groovy indeed! What a …

August 29th, 2004 at 10:43 am
Prashant Mullick adds this Comment:

Hi Alex,

That is a great design. I made a few modofications to the CSS and hope that is permitted under the License of the design.

I’ve converted into a layout that centers on the page and uses some different gifs for backgrounds.

You can find a working example of it at WorldIsGreen.com.

I applied a margin:auto to the rap and body.

Is that a good way to center everything?

Any views/reviews?

If there are copyright issues with using your CSS then let me know. I will replace the design with something else.

Thanks for the great WP designs.

September 4th, 2004 at 10:21 am
Alex adds this Comment:

I’m not sure what browsers you tested in, but in Mozilla and in IE 5 (if I remember correctly) things don’t look right.

September 4th, 2004 at 10:47 am
Prashant adds this Comment:

I tried it in Firefox and IE 6. Haven’t tested in any other browser.

Could you tell me what problems you are seeing?

September 4th, 2004 at 11:10 am
Alex adds this Comment:

Was removing the borders and shading from the body of the page intentional? The background image and shading is there on the header, but nothing below that in Camino or Safari. If you test in IE 5 and IE 5.5 you’ll see a few other problems.

Test in Safari with iCapture.

September 4th, 2004 at 11:13 am
Prashant adds this Comment:

Thanks alex,

I’ve taken down that design. Will do that testing and see if those things can be fixed or not.

September 4th, 2004 at 11:44 am
Prashant adds this Comment:

I’ve fixed some errors in the layout that I was seeing earlier.

Here is the live site:
WorldisGreen.com.

The style sheet can be downloaded here.

Alex, if you would like, feel free to add this style to your collection of styles. I call it GreenPaper.

September 4th, 2004 at 5:23 pm
Prashant Mullick's Weblog adds this Trackback:

GreenPaper
A few days ago, Suhit from Deeshaa.com asked me to help him with a redesign of his weblog. I don’t exactly call myself a designer and its only been about 4-5 months since I first learnt CSS. In any case, I thought I could have some fun doing this so…

September 4th, 2004 at 5:33 pm
Alex adds this Comment:

I’m afraid it’s pretty well hosed in IE 5 and IE 5.5. You need to add text-align: center; to the body tag to center things in IE 5.x, then it may work centered.

September 4th, 2004 at 7:09 pm
Prashant adds this Comment:

The text-align:center; helped…

Looks fixed now.
Works in IE 5.x

September 4th, 2004 at 7:34 pm

Add a Comment

Please note: Use of a non-personal web site or blog in the field below and/or comments that are off-topic, personal attacks, or support requests will likely be removed at my discretion.