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. 😉
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?
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.
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.)
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.
What would be the easiest and safest way to center this style? Is it possible, Alex? I –as many others– like centered things….
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.
Won’t adding the rules:
margin: 0 auto 0 auto;
to #rap center the layout?
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.
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.
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 …
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.
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.
I tried it in Firefox and IE 6. Haven’t tested in any other browser.
Could you tell me what problems you are seeing?
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.
Thanks alex,
I’ve taken down that design. Will do that testing and see if those things can be fixed or not.
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.
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…
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.
The text-align:center; helped…
Looks fixed now.
Works in IE 5.x
🙂
僕らã®ãƒ¬ãƒ¼ã‚·ãƒƒã‚¯BBSã¸ã‚ˆã†ã“ã