Kom ihåg mig?

snabb css fråga

Ämnesverktyg Visningsalternativ
Oläst 2006-01-21, 11:12 #1
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
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
Kod:
.test2 {
margin:0;
padding:3px;
border-left: solid 1px #ccc;
float:right;




}

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

   }
Kod:
<div>

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

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

</div>
tack på förhand
ashur är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 11:59 #2
digiArt digiArt är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jan 2004
Inlägg: 1 426
digiArt digiArt är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jan 2004
Inlägg: 1 426
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?
digiArt är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 12:06 #3
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
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.
ashur är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 12:52 #4
digiArt digiArt är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jan 2004
Inlägg: 1 426
digiArt digiArt är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jan 2004
Inlägg: 1 426
Du kanske kan vara intresserad av den här artikeln
digiArt är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 12:56 #5
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
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.
ashur är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 16:53 #6
eleven eleven är inte uppkopplad
Medlem
 
Reg.datum: Aug 2004
Inlägg: 81
eleven eleven är inte uppkopplad
Medlem
 
Reg.datum: Aug 2004
Inlägg: 81
Testa att flytta upp <span> taggen.
Och du har en extra div som inte avslutas..

Kod:
<!-- 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:
eleven är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-21, 20:08 #7
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
ashur ashur är inte uppkopplad
Nykomling
 
Reg.datum: Jun 2005
Inlägg: 37
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:
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 ' 
 	';
	}

?>
ashur är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-22, 21:11 #8
HeT HeT är inte uppkopplad
Nykomling
 
Reg.datum: Jan 2006
Inlägg: 11
HeT HeT är inte uppkopplad
Nykomling
 
Reg.datum: Jan 2006
Inlägg: 11
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
HeT är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-01-24, 15:04 #9
martines avatar
martine martine är inte uppkopplad
Mycket flitig postare
 
Reg.datum: Mar 2005
Inlägg: 767
martine martine är inte uppkopplad
Mycket flitig postare
martines avatar
 
Reg.datum: Mar 2005
Inlägg: 767
Om du har divven innan divven (?...) så hamnar den rätt.

Vad jag menar är:
Kod:
<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...
martine är inte uppkopplad   Svara med citatSvara med citat
Svara


Aktiva användare som för närvarande tittar på det här ämnet: 1 (0 medlemmar och 1 gäster)
 
Ämnesverktyg
Visningsalternativ

Regler för att posta
Du får inte posta nya ämnen
Du får inte posta svar
Du får inte posta bifogade filer
Du får inte redigera dina inlägg

BB-kod är
Smilies är
[IMG]-kod är
HTML-kod är av

Forumhopp


Alla tider är GMT +2. Klockan är nu 18:28.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson
 
Copyright © 2017