[EMAIL PROTECTED] wrote:

>Guru to the rescue! :)
>
>You are great!  Thank you!
>
>BUT!  Is there ANY way you can get the same result without the empty divs?:
><div class="topcorners"></div>
><div class="gap-saver"></div>
><div class="floatclearer"></div>
><div class="gap-saver" id="help-ie"></div>
><div class="bottomcorners"></div>
>
>I would much rather use CSS hacks than have CSS hooks!
>
>If not, I understand, I REALLY appreciate your help!
>
Aha! Yes, now we understand the principles & the universal model with 
all options, it is possible to simplify at random. :-)
For instance:

    * We can mount the cornerbox header text as image in the #infoborder
      image. (> advantage: never font-size scaling problems)
    * We can combine this header+infoborder image with the top corners
      image. (> 1 hook less needed)
    * We can assign this new combined image to the starting #bottomlinks
      div. (> no more topcorner div needed)
    * We can forget the detail of lifting the inside of the box upwards,
      and pulling the bottom corners upwards (> no more gap-savers needed).
    * Now there is no need for a special treatment (and needed hooks)
      for IE, and we can use the old #bottomlinks ul:after in the css.
      (> no more floatclearer div needed)
    * If desired, even the bottomcorners div can be missed, if there is
      a following div (without background stuff), which can serve as
      hook for the bottom corners image. But then deleting this next
      element will cause the cornered box to be incomplete, so I
      shouldn't do that, and let all the corner things in the
      #bottomlinks box.

Without the last one, I made a fresh testpage. 
<http://home.tiscali.nl/developerscorner/css-discuss/test-phazm-corners-4.html>
The html is now:

<div id="bottomlinks">
   <div class="inside">
      <ul>
         <li><a href="#">.....</a></li>
         <li><a href="#">.....</a></li>
         <li><a href="#">.....</a></li>
         <li><a href="#">.....</a></li>
         <li><a href="#">.....</a></li>
      </ul>
   </div>
   <div class="bottomcorners"></div>
</div>


Enough clean sweeped? [1] ;-)
Greetings,
francky

[1]
No, still some old residues in the css which can be removed...

PS
I see some fixed font-sizes here and there. If you are intending to make 
them scalable for IE too (em-based; strong advise, if you didn't plan 
already!), I should do it ASAP. If you are some steps ahead in 
designing, it will be way more difficult to adapt the existing styles.

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to