CSS - DIVS without absolute positioning 1

[nego78]

On

http://test.motyl.no-ip.org/dlamechanika/

there is document with styles
On firefox 1.0 it looks but on IE6 it looks bad.

I'm trying to achieve efect

|--------------------|---------|
|#banner | |
|--------------------| #obraz |
|#napis | |
|--------------------|---------|

i wrote

    <div id="obraz"><img src="obrazek.jpg" width="246" height="151" alt="" /></div>
    <div id="banner">banner dlaczego nie na dole ???</div>
    <div id="napis"><img src="napis.gif" width="478" height="63" alt="" /></div>

and in css

div#banner {
   text-align: right;
   padding: 28px 256px 0px 0px;
   height: 60px;
}
div#obraz {
   width: 246px;
   height: 151px;
   float: right;
}
div#napis {
   height: 63px; 
   text-align: right;
   padding: 0px 246px 0px 0px;
}

how can i repair it so it'll work in IE ?
but i don't like to use absolute positioning.

thanks in adv.

gry online

 

[Vragabond]

Why exactly are you applying padding to #napis? That makes the size of that box way too large to fit in the space. While you do use padding to make relatively positioned elements not overlap absolutely positioned, that won't really work with floats. In floats, regular elements should float around them as long as there is some (height, border, margin, padding) of the element on their right or left side.

 

[nego78]

Vragabond: I removed padding and now it looks ok.
Many tx.


gry online