[cezar]

Försöker ta med den kod som är viktig i sammanhanget.
Skriver de i kronologisk ordning...

body { margin:0 auto; }

.bg  { 
 text-align: center;
     margin-left: auto;
     margin-right: auto;
 background: url(images/index_12.gif) repeat-y;
 width: 515px;
  }

.news { margin-right: auto;
    margin-left: auto;
    padding-left: 31px;
    padding-right: 21px;
    width: 420px;
  }

.info_about { 
        background-color: #302F2F; 
        border-top: 1px solid black;
        border-left: 1px solid black;
        border-right: 1px solid black;
        margin-top: 0px;       
        width: 420px;
        text-align: justify;
       
       }

I info_about diven så vill jag kunna ha text på vänster sida och det går att lösa med text-align:justify; men kruxet är att jag även
vill ha några bilder på höger sida som ska ligga flytande längs med texten.
Får jag göra fler divar för det eller går det inte för att jag har centrerat överliggande divar/body?

[Carina Malmgren]

antingen sätter du in bilderna i en div med float:right; eller så lägger du float direkt på bilderna. det ena alternativet ger en rak linje mellan text och bild, den andra ger ett flyt som gör att texten flyter in mellan bilderna. en smakfråga mao

glöm inte att sätta clear efter.

[cezar]

Originally posted by Carina Malmgren@Aug 22 2006, 14:27
antingen sätter du in bilderna i en div med float:right; eller så lägger du float direkt på bilderna. det ena alternativet ger en rak linje mellan text och bild, den andra ger ett flyt som gör att texten flyter in mellan bilderna. en smakfråga mao

glöm inte att sätta clear efter.

Jag tror jag försökte med float:right; på diven som bilderna låg i och då trycktes allt ihop fast bilderna låg inte till höger.
Är det någe mer värden som man behöver sätta?

[Carina Malmgren]

bredd... marginaler... höjd... ev radbryt mellan bilderna

[cezar]

Originally posted by Carina Malmgren@Aug 22 2006, 15:31
bredd... marginaler... höjd... ev radbryt mellan bilderna

Föresten, går det att lägga divar med float:right; i en div som har värdet text-align: justify; ?


[b]clear[b] ?

[Carina Malmgren]

jo clear bryter av de flytande elementen
tex

.foo {
width:300px;
padding:0; margin:0;
}
.flytavanster { 
float:left; width:150px;
}
.flytahoger {
float:right; width:150px;
}
.clear {
clear:both;
}

<div class="foo">
<p class="flytavanster">fe fai fo fum</p>
<img src="bar.jpg" class="flytahoger" alt="" />
<p class="clear"></p>
</div>

ang justify - ingen aning... prova

[cezar]

Originally posted by Carina Malmgren@Aug 22 2006, 18:42
jo clear bryter av de flytande elementen
tex

.foo {
width:300px;
padding:0; margin:0;
}
.flytavanster { 
float:left; width:150px;
}
.flytahoger {
float:right; width:150px;
}
.clear {
clear:both;
}

<div class="foo">
<p class="flytavanster">fe fai fo fum</p>
<img src="bar.jpg" class="flytahoger" alt="" />
<p class="clear"></p>
</div>

ang justify - ingen aning... prova

Det sprack med float: right men jag förstår inte vad jag ska ha i clear classen.

Sen undrar jag om du sätter width efter bildens storlek eller efter överliggande div's storlek?

[cezar]

Det blev såhär:



Kod css

.text_about { margin-top: 3px;
       margin-bottom: 6px;
       width: 420px;
       
      }

.float_left { float: left;
       width: 240px;
       text-align: justify;
      }

.float_right { float: right;
        width: 220px;
       }

.clear { clear: both; }

Kod - HTML

<div class="text_about">
<p class="float_left">
<b>Computer</b> AMD 3200+, 2GB ram, Silverstone chassi. <br/>
<b>Display screen</b> Fujitsu 17" flat screen. <br/>
<b>Mobile</b> Sony Ericsson w800i.</p>

<div class="float_right">
<a href="images/w800i-1.jpg"><img class="about" src="images/w800i_thumb.jpg" alt="w800i"></a>
</div>

<br/>
<p class="clear">asdasdasd</p>

Detta kräver att clearen är under.
Jag vill att bilden ska flyta gämsmed texten

[Carina Malmgren]

ja förstås...
men lägg bilden först och p sen
att det flyttas ner beror på att bilden + diven är större än den omslutande diven

[Carina Malmgren]

du har inte avslutat diven "text_about"