how to keep one div's right edge same as other div's right edge

----------------                                    ----------------------->edge A
|              |                                    |                   |
| logo         |                                    | drop down list    |
|______________|                                    |___________________|
--------------------     --------------------     -------------------- --->edge B
|                  |     |                  |     |                  |  
|                  |     |                  |     |                  |
|                  |     |                  |     |                  |
| div 1            |     | div 2            |     | div 3            |
|                  |     |                  |     |                  |
|                  |     |                  |     |                  |
|__________________|     |__________________|     |__________________|



--------------------
|                  |
|                  |
|                  |
| div 4            |
|                  |
|                  |
|__________________|

the above is my current page sample.

1. div 1-4 are image grou开发者_StackOverflow中文版ps. I use float left to keep them fit in one line if the site page is wide enough ; if page size is not enough to hold 4 divs, then div4 will go to second line .

2. drop down list div is using float: right , so it always keep in the right edge of page.

here my question is :

how can I keep drop down list's right edge equals to the first div line 's last div 's right edge ==> that means: edge A = edge B

---

This should give a you place to start from: http://jsfiddle.net/ryanrolds/kaaNF/

Checked it in Chrome, FF4 and IE8.

---

It depends how dynamic the image and viewport widths are. There is no way to get them to automatically align as long as you anchor left (float: left). You either need to switch to float: right, or make sure you have a fixed width on the images and set the container to a fixed width so you can anchor the drop-down to the right of the container.

Or, if you really want everything to be dynamic and variable, you'll have to adjust widths with JavaScript after all the images are loaded, and recalculated after every viewport size change.