hrugved

[hrugved]

horizontal icon bar

In this example I have a doubt.

As far as i know <a> tags are inline elements. And we can only add left/right paddings to inline elements, and not top and bottom.

But here it act as block level element as can be seen from this line of code which works :

.icon-bar a{
  padding: 12px 0;
}

So When I inspect the <a> tags, I found that it shows its computed value of display as block.

So how does <a> tag has become block level without explicitly changing its display property?

[Ingolme]

Items that have a float property set to left or right behave as blocks. Personally I'd have explicitly put the "display: block" in the CSS if I had written the code.