Isn't making the spans "display: block" the same as just using divs?  And
therefore
also in violation of the rule about "no anchor tags around block-level
elements" ?

On Tue, Jun 30, 2009 at 12:34 PM, Alexander Wallace <alexmlwall...@gmail.com
> wrote:

> You should give your spans { display: block; }.
> Alternatively, you could use the original divs, but use links inside
> the divs with { display: block; }
>
> -Alex
>
> On Tue, Jun 30, 2009 at 1:25 PM, Noel Taylor <noelta...@gmail.com> wrote:
>
> > Dear css-d gurus:
> >
> > I want to make a box that shows the progress that a non-profit has made
> > toward a
> > certain fund-raising goal.  It should look something like:
> >
> > ||XXXXXXXX||                       ||
> >
> > That is, the box should be sub-divided into two boxes: one with a colored
> > background
> > to show the progress toward the goal, and one with a white background
> > representing
> > the percent left to go.  Furthermore, the entire box should be insde
> anchor
> > tags so that
> > it links to another page explaining more about the project.
> >
> > The problem is that if I do this:
> >
> > <div id="container" style="height: 20px; width: 170px; border: 1px solid
> > black">
> > <a href="other_page.html">
> >  <div id="completed" style="height: 20px; width: 38%; background-color:
> > green; float: left"></div>
> >  <div id="remaining" style="height: 20px; width: 62%; background-color:
> > white; float: left"></div>
> > </a>
> > </div>
> >
> > then I'm violating a rule that says you're not supposed to put anchor
> tags
> > around block-
> > level elements, and I'm also using floats in a sketchy way.  However, if
> I
> > do this:
> >
> > <div id="container" style="height: 20px; width: 170px; border: 1px solid
> > black">
> > <a href="other_page.html">
> >  <span id="completed" style="width: 38%; background-color: green"></span>
> >  <span id="remaining" style="width: 62%; background-color: white"></span>
> > </a>
> > </div>
> >
> > then I don't get anything because spans are only as wide as the content
> > inside them,
> > and the "width" attribute is ignored.
> >
> > Is there a canonical way to do this?  Barring that, does anyone know a
> good
> > way?
> > ______________________________________________________________________
> > css-discuss [cs...@lists.css-discuss.org]
> > http://www.css-discuss.org/mailman/listinfo/css-d
> > List wiki/FAQ -- http://css-discuss.incutio.com/
> > List policies -- http://css-discuss.org/policies.html
> > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> >
> ______________________________________________________________________
> css-discuss [cs...@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to