[ashur]

Hej!

Nu har jag suttit i några timmar och funderat samt testat att få en text i en div att flyyta sig till höger. Men varje gån jag gör det så "ramlar" den ner ett steg.

dvs. Kör jag med float right: så hoppar texten "testing" ner ett steg. Och kör jag utan float så blir det rätt med jag vill inte ha texten där utan längst till höger.
Vet någon varför det blir så?




Css-kod

.test2 {
margin:0;
padding:3px;
border-left: solid 1px #ccc;
float:right;




}

.kantsmf { border: 1px solid #CC6633; padding:3px; width: 28em; 

   }

<div>

 	<div class="kantsmf">
  
  	mupp 
          <span style="font-size: 10px;">

 	
</span><span class="test2">testing</span>

</div>

tack på förhand

[digiArt]

span är ett inline-element
div är ett block-element

prova med display:block; på span och gör sedan om experimentet.

Alternativt sätter du en bredd på span-elementet och väljer text-align:right;

Varför har du ett tomt span-element förresten?

[ashur]

Nu har jag testat att använda display:block. Då hamnar texten i rätt höjd men precis utanför "div:et", vill ha den därinne.

Kör jag med bredd på span-element och text-align: right så är den på samma ställe men förflyttar sig en liten bit upp.

ang. att jag har ett tomt span-element är att det ska finnas en php kod därinne. Jag tog bort den så att ni får en klarare bild på hur det ser ut.

[digiArt]

Du kanske kan vara intresserad av den här artikeln

[ashur]

Jo den länken har jag läst och testat, men när jag lägger mina koder i den så får jag inte till det.
Säkert något enkelt fel, men hittar tyvärr inte den.

[eleven]

Testa att flytta upp <span> taggen.
Och du har en extra div som inte avslutas..

<!-- HEAD -->
<style style="text/css">
 .test2 {
 margin: 0px;
 padding: 0px;
 border-left: solid 1px #ccc;
 float: right;
}

.kantsmf { 
 border: 1px solid #CC6633;
 padding: 3px;
 width: 28em;
}
</style>
 


<!-- BODY -->
<div class="kantsmf">
 	
 	<span class="test2">testing</span>
 	mupp

</div>

CSS är tyvärr inte min starkaste sida men, verkade bli som du ville ha det i alla fall?


h34r:

[ashur]

det blir som jag ville med hjälp av din kod, tack för hjälpen.

Men när jag ska lägga den på min riktiga kod så kommer "felet" igen.

färdiga kod:

<?php

$array = ssi_boardNews(1.0, 3, null, 250, 'array');

	foreach ($array as $news)
	{
 echo ' 
 	<div class="kantsmf">
  
  	<b><a href="', $news['href'], '">', $news['subject'], '</a> </b>
          <span class="test2">testing</span>
  	<span style="font-size: 10px;">

        ', $txt[525], '
        ', $news['poster']['link'], '
 	
</span></div>


  
 
 	';

 if (!$news['is_last'])
 	echo ' 
 	';
	}

?>

[HeT]

Om du börjar om med dina exempel-divar igen och lägger "float:right"-diven först så borde den inte byta rad...
/Tjo
H

[martine]

Om du har divven innan divven (?...) så hamnar den rätt.

Vad jag menar är:

<div style="float: right">testing</div>
<div>Mupp</div>

Använd helst inte <span> för flytande element (även om det går med display:block...