Hi,
I've styled the <a hrefs on a page, but it is spacing them and I'd like not to have the space (1 pixel I think) between them.
If I style in divs, there is no space, but a change to anchors and the space reappears.
Is it possible, or is it built into ie/anchors?
VinceBy default there is not space created between hyperlinks you'll have to expand on what you mean.For example:
<a href='http://www.webdeveloper.com/forum/archive/index.php/#' style='width:10%; height: 10%; border: solid 1px #000; margin:0; padding:0;'>dfg</a>
<a href='http://www.webdeveloper.com/forum/archive/index.php/#' style='width:10%; height: 10%; border: solid 1px #000;'>dgf</a>
Produces two boxes next to each other. But they are anchors and there is a gap between them. Change them to divs instead and you don't get a gap. Its not critical, but I would like to know why if didn't like it.
VinceThat's one annoying bug that always causes me problems too.
Solutions:
1) Use float:left; on each item.
2) Take the line break out from your source code.
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link1</a><a href="#">link2</a>
instead of
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link1</a>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link2</a>I took the return chars out (so the anchors in the html were next to each other) and the space removed... hmmm
Yet another bug to ie lol
Cheerssure thing.
1) Use float:left; on each item. Would you also have to display:block; on them, too? Can inlines float?Originally posted by ray326
Would you also have to display:block; on them, too? Can inlines float? By default, inline-level elements will sit next to each other due to them being inline-level. For example:<span>foo</span>
<span>bar</span>Will appear to be next to each other since they do not take up their own lines like other elements (i.e., block-level elements). The key thing here is that inline-level elements, if you will, tend to "float" without the help from any CSS since that is just their natural behavoir. However, block-level elements — to sit next to each other — require the use of the float CSS property since by default, they will take up their own lines. Therefore, using the same structure as the previous example:<div>foo</div>
<div>bar</div>Will appear as each one taking up their own line. To then get it to act like the <span> elements in the previous example, you would have to use the float CSS property:<div style="float: left;">foo</div>
<div>bar</div>Well I've tested in IE6, Netscape 7.1, Opera7.2, and yes, so far inlines can float...
W3 use this code in the 2.1 CSS spec, so I guess it must be allowed:
img.icon {
float: left;
margin-left: 0;
}
I can't see anything in the 'exact rules' about it either.
<!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS21/visuren.html#float-rulesJust">http://www.w3.org/TR/CSS21/visuren.html#float-rulesJust</a><!-- m --> beaten to it I see...
I've styled the <a hrefs on a page, but it is spacing them and I'd like not to have the space (1 pixel I think) between them.
If I style in divs, there is no space, but a change to anchors and the space reappears.
Is it possible, or is it built into ie/anchors?
VinceBy default there is not space created between hyperlinks you'll have to expand on what you mean.For example:
<a href='http://www.webdeveloper.com/forum/archive/index.php/#' style='width:10%; height: 10%; border: solid 1px #000; margin:0; padding:0;'>dfg</a>
<a href='http://www.webdeveloper.com/forum/archive/index.php/#' style='width:10%; height: 10%; border: solid 1px #000;'>dgf</a>
Produces two boxes next to each other. But they are anchors and there is a gap between them. Change them to divs instead and you don't get a gap. Its not critical, but I would like to know why if didn't like it.
VinceThat's one annoying bug that always causes me problems too.
Solutions:
1) Use float:left; on each item.
2) Take the line break out from your source code.
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link1</a><a href="#">link2</a>
instead of
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link1</a>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link2</a>I took the return chars out (so the anchors in the html were next to each other) and the space removed... hmmm
Yet another bug to ie lol
Cheerssure thing.
1) Use float:left; on each item. Would you also have to display:block; on them, too? Can inlines float?Originally posted by ray326 Would you also have to display:block; on them, too? Can inlines float? By default, inline-level elements will sit next to each other due to them being inline-level. For example:<span>foo</span>
<span>bar</span>Will appear to be next to each other since they do not take up their own lines like other elements (i.e., block-level elements). The key thing here is that inline-level elements, if you will, tend to "float" without the help from any CSS since that is just their natural behavoir. However, block-level elements — to sit next to each other — require the use of the float CSS property since by default, they will take up their own lines. Therefore, using the same structure as the previous example:<div>foo</div>
<div>bar</div>Will appear as each one taking up their own line. To then get it to act like the <span> elements in the previous example, you would have to use the float CSS property:<div style="float: left;">foo</div>
<div>bar</div>Well I've tested in IE6, Netscape 7.1, Opera7.2, and yes, so far inlines can float...
W3 use this code in the 2.1 CSS spec, so I guess it must be allowed:
img.icon {
float: left;
margin-left: 0;
}
I can't see anything in the 'exact rules' about it either.
<!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS21/visuren.html#float-rulesJust">http://www.w3.org/TR/CSS21/visuren.html#float-rulesJust</a><!-- m --> beaten to it I see...