[naak2803]

Hej,
Jag skulle behöva återskapa priset endast medhjälp av css, någon som kan hjälpa till?

dvs det ska två antal kronor på vänster sedan ska det så antal ören till höger men något upphöjt och under ören ska det står en liten text.

[Knockout]

Finns det någon färdig HTML struktur?

[naak2803]

Ursprungligen postat av Knockout

Finns det någon färdig HTML struktur?

nej, jag är endast ute efter priset i css/html...

[allstars]

på denna sida hittade jag lite tips: http://codepen.io/pixelass/pen/gbGZYL

vilket ledde fram till detta:

<style>
	.price {
		display:inline-block;
	   -webkit-text-stroke: 1px black;
		font-style:italic;
	   padding-right:1em;
	   font-size:80px;
	   font-family:sans-serif;
	   font-weight:800;
	   position:relative;
	   text-shadow: -4px -4px 0 yellow, 
	   -4px -3px 0 yellow, -4px -2px 0 yellow, -4px -1px 0 yellow, -4px 0px 0 yellow, -4px 1px 0 yellow, -4px 2px 0 yellow, -4px 3px 0 yellow, -4px 4px 0 yellow, -3px -4px 0 yellow, -3px -3px 0 yellow, -3px -2px 0 yellow, -3px -1px 0 yellow, -3px 0px 0 yellow, -3px 1px 0 yellow, -3px 2px 0 yellow, -3px 3px 0 yellow, -3px 4px 0 yellow, -2px -4px 0 yellow, -2px -3px 0 yellow, -2px -2px 0 yellow, -2px -1px 0 yellow, -2px 0px 0 yellow, -2px 1px 0 yellow, -2px 2px 0 yellow, -2px 3px 0 yellow, -2px 4px 0 yellow, -1px -4px 0 yellow, -1px -3px 0 yellow, -1px -2px 0 yellow, -1px -1px 0 yellow, -1px 0px 0 yellow, -1px 1px 0 yellow, -1px 2px 0 yellow, -1px 3px 0 yellow, -1px 4px 0 yellow, 0px -4px 0 yellow, 0px -3px 0 yellow, 0px -2px 0 yellow, 0px -1px 0 yellow, 0px 0px 0 yellow, 0px 1px 0 yellow, 0px 2px 0 yellow, 0px 3px 0 yellow, 0px 4px 0 yellow, 1px -4px 0 yellow, 1px -3px 0 yellow, 1px -2px 0 yellow, 1px -1px 0 yellow, 1px 0px 0 yellow, 1px 1px 0 yellow, 1px 2px 0 yellow, 1px 3px 0 yellow, 1px 4px 0 yellow, 2px -4px 0 yellow, 2px -3px 0 yellow, 2px -2px 0 yellow, 2px -1px 0 yellow, 2px 0px 0 yellow, 2px 1px 0 yellow, 2px 2px 0 yellow, 2px 3px 0 yellow, 2px 4px 0 yellow, 3px -4px 0 yellow, 3px -3px 0 yellow, 3px -2px 0 yellow, 3px -1px 0 yellow, 3px 0px 0 yellow, 3px 1px 0 yellow, 3px 2px 0 yellow, 3px 3px 0 yellow, 3px 4px 0 yellow, 4px -4px 0 yellow, 4px -3px 0 yellow, 4px -2px 0 yellow, 4px -1px 0 yellow, 4px 0px 0 yellow, 4px 1px 0 yellow, 4px 2px 0 yellow, 4px 3px 0 yellow, 4px 4px 0 yellow,
	   3px 3px 8px black; /*detta är för skuggan*/
  color: #black;

	}
	.price sup {font-size:.6em;position:absolute;top:.2em;right:.8em}
	.price sub {font-size:.4em;position:absolute;top:1.8em;right:.2em}
	</style>

        <p class="price">29<sup>90</sup><sub>pr.stk</sub></p>
	<p class="price">199<sup>90</sup><sub>pr.stk</sub></p>
	<p class="price">200<sup>00</sup><sub>pr.stk</sub></p>

Vilket blev detta resultatet (i IE)


Det blir lite pill för att få till det i alla webbläsare dock.

[naak2803]

tackar! det där var perfekt.