DIV instead of TABLE

[crashmaster]

hi...
I am starting to use DIVs instead of TABLE>.
I have i question ..
I have code in tables
[code]
<table width="643" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="5"><img src="imgs/header.gif" width="643" height="74" /></td>
  </tr>
  <tr>
    <td><img src="imgs/header_left.gif" width="171" height="30" /></td>
    <td><img src="imgs/header_home.gif" width="85" height="30" /></td>
    <td><img src="imgs/header_about.gif" width="79" height="30" /></td>
    <td><img src="imgs/header_portfolio.gif" width="121" height="30" /></td>
    <td><img src="imgs/header_right.gif" width="188" height="30" /></td>
  </tr>
</table>
[/code]

I need to do the same effect but in DIV ///
Can somebody help me ??

[progbass8]

Try something like this:

[code]
<div width="643" border="0" >
<img src="#" width='643' height='74' alt="img0" />
<br>
<img src="#" width="171" height="30" alt="img1" />
<img src="#" width="85" height="30" alt="img2" />
<img src="#" width="79" height="30" alt="img3" />
<img src="#" width="121" height="30" alt="img4" />
<img src="#" width="188" height="30" alt="img5" />
</div>
[/code]

The line break should function the same way as a new tablerow.  If it doesn't, let me know.

-Bryan

[crashmaster]

its bad idead..coz images have no its position,..
and it doesnt match to itself...
it is look like this:
[img]http://www.test.magistri.net/untitled.jpg[/img]

[cmgmyr]

Try this
<div id="wrapper" style="margin:0px auto;">
<div style="width:643; height:74;" ><img src="#" width='643' height='74' alt="img0" /></div>
<div style="width:643; height:30;padding:0px;" ><img src="#" width="171" height="30" alt="img1" /><img src="#" width="85" height="30" alt="img2" /><img src="#" width="79" height="30" alt="img3" /><img src="#" width="121" height="30" alt="img4" /><img src="#" width="188" height="30" alt="img5" /></div>
</div>

** make sure all of your link images are on one line. IE has problems with new lines when doing something like this.

-Chris

[moberemk]

[code]<div id="wrapper" style="margin:0px auto;">
<div style="width:643; height:74;" ><img src="#" width='643' height='74' alt="img0" /></div>
<div style="width:643; height:30;padding:0px;" ><img src="#" width="171" height="30" alt="img1" /><img src="#" width="85" height="30" alt="img2" /><img src="#" width="79" height="30" alt="img3" /><img src="#" width="121" height="30" alt="img4" /><img src="#" width="188" height="30" alt="img5" /></div>
</div>[/code]
Actually, no, don't do that. That's bad. It uses inline style definitions and won't solve the problem. Instead, do this:
[code]
<div id="header">
    <div id="header_img"><img src="#" width="643" height="74" alt="img0" /></div>
    <div id="header_img_row"><img src="#" width="171" height="30" alt="img1" /><img src="#" width="85" height="30" alt="img2" /><img src="#" width="79" height="30" alt="img3" /><img src="#" width="121" height="30" alt="img4" /><img src="#" width="188" height="30" alt="img5" /></div>
</div>
[/code]
Then attach this piece of code to your stylesheet:
[code]
div#header_img_row img {
      margin: 0px;
      padding: 0px;
}
[/code]
By doing that, there won't be any spacing to the images.

[crashmaster]

ok,,,thank you 0))