CSS - Variable Width Tiling Backgrounds And Transparent Images

how is that possible cross browser without javascript (i dont know if these filters in IE is javascript but they are good)



i know its possible...only i dont know how..
must be someone here who know i thought

thanx a lot in advance

Hi: If there is a post related to my question kindly redirect me there -- will be much appreciated.

Question: Can a form be made transparent rather than using a solid color or, can you create a transparent background using CSS?

If so, how is it done? Links, if any, please!

Thank you.

There are very few things which are just impossible to do using HTML and CSS, but I'm wondering if I've finally hit something that is.

First, some background: I'm trying to do some code for a wordpress image gallery on my blog. I have a plugin that allows me to code the gallery however I want, so that's not a problem.

However, I'm redesigning my site, and I want to keep both galleries I have already posted and new galleries that I'm going to post to all look the same. The problem is this: the old galleries all have 2 images in a row, while the new ones will have 3 images in a row (and perhaps even 4 in some situations).

All images in any given gallery will have the same heights and widths, but height and width of images between galleries can change.

What I've been trying to accomplish is the following:

A box, which creates a border around the entire gallery. Images stack horizontally as wide as they can go on the page, then drop down to the next line. As I said, sometimes this will be 2 and sometimes 3 images. However, the border should always be "skin tight" (give or take a few pixels of padding) around the gallery.

I've tried just about every combination of tags, floating, and display options, and nothing seems to work.

Either the containing element is either full width of it's container (if container is display block or inline-block with no width) constrains the widths of the images (if it does have a width), or the box doesn't fully contain the top row of images (if the container is display inline with non-floated content).

I can usually either get the right width, but not the right height, or the right height, but not the right width. Getting both the right height and width appear to be the problem.

As of right now, my code for the gallery looks something like the following (it is ever changing, so it's kind of pointless to post what it is at this exact moment):

Code:

<div class="outer">
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
   <span class="inner"><a href="whatever"><img /></a></span>
</div>

However, I'm just running out of ideas, and I'm about ready to either say "screw the look of the old galleries" or use wordpress's built in options for how many rows there are (the problem with this is I have to set it for each gallery - something that I'm trying to avoid if possible, as resorting to that also presents issues with galleries I've already posted)

I'm trying to tile a background image horizontally with a vertically tiled background image centered on the page. Being new to css and not particularly fluent in html (although more so than css), I have no idea how to go about doing this or if it is even possible. I do have both images working separately though. Help would be appreciated.

-alexa

I'm designing a page he (URL address blocked: See forum rules)

I'm confused on how to make the top bar image span the width of each side and still be in synch with the center background image. I've done this with tables on the old version of the site (here ), but is it possible with CSS? Here's the code for the bars currently:

.BGLEFTTOP{
position:absolute;
left:0%;
top:0px;
height:88px;
width:50%;
margin-left:-456;
background:url((URL address blocked: See forum rules))
repeat-x;
background-position: right top;
z-index:1;}

.BGRIGHTTOP{
position:absolute;
right:0%;
top:0px;
height:88px;
width:50%;
background:url((URL address blocked: See forum rules))
repeat-x;
background-position: left top;
z-index:1;}