copyright © CSSPG, lud October 18 2000

 for practical use of CSS

Tips

this document is located at...
<URI:http://css.nu/pointers/mark-tip.html>

 Centring Image Groups 

In the 2nd Amendment Law Library, Mark Fuller shares Law Journal articles and book reviews relevant to the Second Amendment (and a neat little 'Lynx Inspected' icon). His grouping of icons lined up beautifully in Netscape Navigator 4x, leading to the solution below.

In your external CSS file, include a declaration like:

.center {text-align: center; }

And call it out in your HTML with something like:

  <DIV CLASS="center">
  <A HREF="http://www.w3.org/pub/WWW/Style/CSS/Buttons"><IMG width=88 height=31
  src="mwcos.gif" alt="Made with CSS." ></A> <A HREF=
  "http://www.anybrowser.org/campaign/"><IMG width=88 height=31
  src="anybrowser3.gif" alt="Best Viewed With Any Browser." ></A>
  <A HREF="http://www.cast.org/bobby/"><IMG width=88 height=31
  src="approved.gif" alt="Bobby approved." ></A> <A
  HREF="http://www.delorie.com/web/lynxview.html"><IMG width=88
  height=31 src="lynxpaw.gif" alt="Lynx inspected." ></A>
  <A HREF="http://validator.w3.org/"><IMG width=88 height=31
  src="vh40.gif" alt="Valid HTML 4.0!" ></A>
  </DIV>

The following demonstration is taken directly from Mark's index page.

Note: Height, width and border attributes need to be specified in your HTML, as the CSS equivalents are either unsupported or 'buggy'. Additionally, if you *still* have trouble with alignment, try making the entire declaration on one line. Netscape's CSS support (cough) is problematic.

CSS Pointers Navigation

Index · Browser Bugs · Books · Tools · DHTML · XSL & DSSSL

Main Site Navigation

Index · Articles · Examples · Experiments · FAQ · Markup · Styles · Who is?

CSSPG ~ Sue ~ Roland