Hi All,

I have used <b> tag in my code.

It is like

<div>
 <table>
   <tr>
     <td>
       <B style="BACKGROUND-COLOR: orange; DISPLAY: block; HEIGHT: 1px; MARGIN-LEFT: 5px; OVERFLOW: hidden; MARGIN-RIGHT: 5px; ></B>
<B style="BACKGROUND-COLOR: orange; DISPLAY: block; HEIGHT: 1px; MARGIN-LEFT: 3px; OVERFLOW: hidden; MARGIN-RIGHT: 3px; ></B>
<B style="BACKGROUND-COLOR: orange; DISPLAY: block; HEIGHT: 1px; MARGIN-LEFT: 2px; OVERFLOW: hidden; MARGIN-RIGHT: 2px; ></B>
<B style="BACKGROUND-COLOR: orange; DISPLAY: block; HEIGHT: 1px; MARGIN-LEFT: 1px; OVERFLOW: hidden; MARGIN-RIGHT: 1px; ></B>

This will draw 4 lines which will look like a curved ends. Its work fine in mozilla but in IE it shows gap between each lines after onclick or doing some changes in css then only it comes closer. Please suggest me what to do for this problem?

Well, that's quite stupid code you have there, sorry to say. Is it correct that you just want 4 orange lines? If so, and if you don't want to use an image (which I would find better), try something more like this:

<div id="lines">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>
#lines div {
  margin:5px;
  height:1px;
  background-color:orange;
}

Why not <hr /> ?

Could be done but it's meant for content seperation.

Hi,
I'd use an image, unless you intend for there to be text on the lines that is following the curve. Twiss's comments above won't help you as he ignored the changing line ends give the curve you have in your code.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.