[vs2005] how to set div container width

Hi team, when you have multiple images and you want to contain it in div how you get the total div width. My understanding is that you sum all image width and you will have the div container width. But that did work for me in vs design environment.

CSS

Code:

---

#search{background:green;float:left;width:73px;height:34px;}
#logout{background:green;float:left;width:73px;height:34px;}
#web{background:green;float:left;width:72px;height:34px;}
#email{background:green;float:left;width:74px;height:34px;}
#clear{clear:both;}

---

HTML

Code:

---

<div style="width:292px; height:34px; float:left;">
<div id="search"><img src="_images/search.jpg"  alt="search" /></div>
<div id="logout"><img src="_images/logout.jpg"  alt="logout" /></div>
<div id="web"><img src="_images/web.jpg"  alt="web" /></div>
<div id="email"><img src="_images/email.jpg"  alt="email" /></div>
<div class="clear"></div>

---

http://img833.imageshack.us/img833/8110/img1x.th.gif

you have borders on the right side of every div you're using, it looks like. borders add to the width of something, just as padding does. if you have a 1 pixel border on one side of the element, that's +1 pixel width for every element. if you have a 1 pixel border on both sides of one element, that's +2 pixel width for every element. try compensating for the border that would be added by increasing your container's width by 4 pixels (you have 4 image divs).

hey, I don not require border on that divs on the first place so by setting border:0px will clear all that it is.

thanks.

Hi there jlbantang,

your code appears to be an excellent example of 'Divitis' :eek:
Check out the symptoms here...

• Divitis:- what it is, and how to cure it

Take a look at the attachment for a semantic rendering of the code. ;)

hey,

nice post. hoping to find the cure the soonest time. like im 80% complete of the project and now i have to reconstruct markups again... tough job... nonetheless like it as well.