WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
Hello guys.
I was hoping that someone could write some code that would let me put 64 x 64 pixel images in boxes next to each other. I'd like the images to be centered in the boxes and I have three images that I'd like to post.
Here's a link to my blog (in specific the page I'd like the images on):
http://kaleidoscopesounds.wordpress.com/links/
The blog I need help with is kaleidoscopesounds.wordpress.com.
One easy way to align images side by side is to set the first image to align "left"and then set the image alignment on all the other images to "none"
Another easy way to insert a group of images neatly arranged in rows and columns is the WP gallery feature: http://en.support.wordpress.com/images/gallery/
The page you linked to is empty. Insert the images first, then we'll see if and what code you need.
Sorry for not responding sooner. I've been real sick.
I've inserted the images (although they didn't come out on one line for some reason).
They didn't come out on one line because you've set their alignment to left - center - right. Doesn't work that way!
Align-left means position left, with the rest of the content wrapping around the right side of the image.
Align-right means position right, with the rest of the content wrapping around the left side of the image.
Align-center means position center, with no wrap-around (= the rest of the content below the image).
So start by setting the alignment of all three images to left. Then tell us if you want the whole group next to or below the page title, centered or not, and what exactly you mean by "boxes": borders around the images, with some white space between image and border? how thin or thick? what color?
By the way, a few days ago another user asked a similar question. Their page here:
http://surfingchillwaves.wordpress.com/links/
You want something like that (with the borders joined together), or a separate square for each image?
PS Sorry, disregard the question about whether you want the whole group next to or below the page title: I forgot that in the theme you're using the content shows up next to the title anyway.
Wow! That looks really good. If you could write the code that enabled my page to look like that (with the borders joined together) that'd be awesome!
The easiest solution is this (in the HTML editor, of course):
<div style="width:246px;margin-top:11px;margin-bottom:27px;background-color:#959EA1;padding:18px 0 0 18px;">
CODE OF ALL THREE IMAGES HERE
<br style="clear:both;" />
</div>But don't forget to replace aligncenter and alignright in the second and third image codes with alignleft.
You can change the margin-top and margin-bottom numbers to adjust the space that separates the box from the header and the footer of the theme.
959EA1 is the color of the title of your page. But you can change it - palettes and color codes here:
http://www.december.com/html/spec/color.html
If you don't like the result (for instance, if you'd like to change the distance between the images), we'll need to create a more complicated code.
By the way, at the moment your images link to themselves instead of the URLs they're supposed to.
This topic has been closed to new replies.
