Displaying hypertext as block level

[HugginItOut]

I've googled this and can't seem to come up with anything.

If I want to display all my hypertext links as block-level elements, as opposed to inline elements is there a style for that? Something along the lines of a{ "style":"value"}

Thanks.

 

[Deleted member 65081]

Well, the answer would be to use...

a { display: block; }

I am not sure of a situation where that would be advisable though. If you are flushing out a menu, consider an unordered list and keep the list items as block elements (for vertical menus).

Display Declaration

 

[DaveyT]

Hey HugginItOut,

Are you taking the same class as me?
That happens to be where I'm stuck.
Can't seem to be able to break the list of menu links out as separate buttons.
The instructions say it wants me to "display hypertext elements as block-level elements.
Another student said to try "display=block".
Anyone out there able to help?

Thanks,
DaveyT

 

[DocFaustus]

Well, the answer would be to use...

a { display: block; }

I am not sure of a situation where that would be advisable though. If you are flushing out a menu, consider an unordered list and keep the list items as block elements (for vertical menus).

Display Declaration

Tweakin's warning needs to be considered but it is a bit cryptic. I would like to elaborate on it a bit to try to help anyone who runs into problems if using this method as a navigation menu.

There isn't much wrong with setting an anchor to display as a block, it actually keeps your CSS cleaner/easier to read this way. The real problem is IE utterly fails when putting blocked anchors inside of a list, this makes many menu styles that are trivial in modern browsers almost impossible to replicate in IE without ripping your hair out.

See: hasLayout, Peek-a-boo bug, list white space bug, Partial Click Bug, and many others.

Putting the display block on the list has it's own set of problems in IE, so you are left juggling a complex set of conditions to try to achieve a marginally acceptable menu system.

Good luck.

* This post was written while I am trying to put together a non fixed width horizontal nav menu with vertical multi-level drop downs. IE needs to die.

 

[DaveyT]

With all of the resources of MS, why won't they make a browser that's friendly to developers?

 

[PTNL]

With all of the resources of MS, why won't they make a browser that's friendly to developers?

What have you not been able to overcome that is inherent only to IE?

 

[maw]

There isn't much wrong with setting an anchor to display as a block, it actually keeps your CSS cleaner/easier to read this way. The real problem is IE utterly fails when putting blocked anchors inside of a list, this makes many menu styles that are trivial in modern browsers almost impossible to replicate in IE without ripping your hair out.

This problem can be solved by explicitly defining a width
E.g.
li a {display: block; width: 100%;}