[ Date Index ][
Thread Index ]
[ <= Previous by date / thread ] [ Next by date / thread => ]
On Wednesday 02 Jul 2003 9:57 pm, Tony Atkin wrote: > On Wednesday 02 July 2003 7:59 pm, Neil Williams wrote: > > Which rules are giving problems, Tony? There are problems with older > > versions of IE and their mis-handling of the element box, but generally > > what works in Mozilla seems OK in later versions of IE from the CSS I'm > > using. > > Yep, it's the box model in IE. I was trying to convert a table-based > layout into a css layout and needed a bit of pixel-perfect alignment. I > got this working perfectly on Opera, Mozilla and (suprisingly) Konqui but > trying IE6 (yes six!) gave some misalignments of the sort that I thought > had only existed in IE5. So I gave up! and went back to a simpler design > of my own devising which I intend to defend to the death :-) > You do that! But should anyone be interested, there is a work-around for the element box bug in IE. I learnt of the hack from: http://www.amazon.co.uk/exec/obidos/ASIN/0789726173/neilwilliaprogra http://www.callihan.com/cssbook/ The hack itself is explained at: http://www.tantek.com/CSS/Examples/boxmodelhack.html As for converting layout tables into CSS, this is what I'm currently rolling out with the DCLUG site: .columnleft { float:left; width:45%; padding-right:5%; } .foot { float:none; clear:both; } <div class="columnleft"> <p>content here of the left hand column</p> </div> <div> <p> note the plain div tag with no CSS rules (relating to float or position anyway) - this right hand column will now flow around the left column, starting at 45%+5% from the relative left starting position.</p> </div> <div class="foot"> </div> In many cases, the left column is as long or longer than the right. This causes ENORMOUS problems unless the float is reset using the foot class. The div using the foot class must appear after the end of both column </div> ending tags and before any more <div> tags are opened or existing ones closed. I'm also using the media attribute of the link tag to make printing easier as the new pages will default (in recent browsers) to using a printer-friendly stylesheet designed to minimise ink wastage from the black backgrounds to both pages and images whilst also reducing paper wastage by reducing margins and font sizes to make the print cover more of the available paper size and make more site pages fit on a single page of paper. This has meant a slight change to the DCLUG logo on new pages - if people mind, let me know and I'll see if I can find someone with more of an artistic flair to finetune the new PNG format image - needed to provide transparency on printing. -- Neil Williams ============= http://www.codehelp.co.uk http://www.dclug.org.uk http://www.wewantbroadband.co.uk/
Attachment:
pgp00012.pgp
Description: signature