html - How to write text after a circle with a number in it -
html - How to write text after a circle with a number in it -
so,i'm struggling solve unusual thing happens in html code.
i've been trying 3 days or maybe more cannot find out 'problem'.
class="snippet-code-css lang-css prettyprint-override">.variola { max-width: 100%; margin-top: 0.5em; margin-bottom: 1em; -webkit-box-shadow: rgba(0, 0, 0, 0.199219) 0px 0px 20px; background: white; border: 1px solid #ccc; border-bottom-left-radius: 5px 5px; border-bottom-right-radius: 5px 5px; border-top-left-radius: 5px 5px; border-top-right-radius: 5px 5px; padding: 8px; " } </style> <style> .cerculet { display: block; font-size: 120%; line-height: 145%; width: 1.6em; height: 1.6em; text-align: center; border-radius: 50%; background-color: black; color: white; white-space: nowrap; } </style> <style> .introducere { display: table-cell; vertical-align length: 5; padding-left: 3em; padding-top: 0.1em; } class="snippet-code-html lang-html prettyprint-override"><!doctype html> <html> <head> <!-- aici va fi scris orice cod css pentru ca ulterior sa fie "preluat" intr-un mod indirect de catre codul html pentru imbogatirea paginii web. --> <title>10 cele mai periculoase boli care au facut istorie</title> </head> <body> 10 cele mai periculoase boli care au facut istorie <!-- tot codul de la tag-ul "body" deschis pana la "body" inchis este strict codul pentru pagina web.cei in head sub tag-ul "style" este cod in css si nu va aparea in pagina web,ci va "imbogati" intr-un mod indirect codul html --> <p style="text-align: left"> <img align="absmiddle" src="http://s2.postimg.org/6zkw8piph/time.png">26-martie-2015 <!-- " " este united nations cod of import folosit pentru crea united nations blank(spatiu alb) intre 2 caractere --> <img align="absmiddle" src="http://s29.postimg.org/tkzbm9nwz/domeniu.png">biologie <br> <img align="absmiddle" src="http://s22.postimg.org/k7tec39x9/tags.png">tags: pandemii, cele mai periculoase</p> <hr noshade size="2" style="text-align: left" width="47%"> <br> <!-- cu ajutorul tag-ului "hr" se pot introduce linii in pagina web. "noshade" inseamna ca linia nu o sa aiba contur. --> <h2></h2> <div class="cerculet"> <div> <h2>1 </h2> <div> <h2> <big style="font-weight: bold">a ucis mai mult de 300 de milioane de oameni<br> din intreaga lume in secolul al xx-lea si pe cei<br> mai multi locuitori nativi ai americii.</big> <!-- exact ceea ce spuneam mai sus:codul css va fi "preluat" indirect din "head" si va fi introdus in codul html,combinand cele 2 limbaje. --> <!-- :-) --></h2> </div> </div> </div> <br> <div> variola(cunoscuta si sub numele latin "variola" sau "variola vera") este o boala contagioasa <br>unica oamenilor.variola este cauza fie de virusul numit variola major,fie de cel numit variola <br>minor.forma mai letala,v. major,are o mortalitate de 30-35%,pe cand v. minor este o forma <br>mai usoara bolii numita alastrim si ucide ~1% din victimele sale.efectele secundare <br>de termen lung pentru supravietuitori includ cicatrici pe piele.alte efecte secundare ocazionale <br>includ orbire datorita ulcerului de cornee si infertilitate la persoanele de sex masculin. </div> <!-- tag-ul "br" sectioneaza textul nostru din pagina web in paragrafe. --> <br> <br> <div> <b>variola ucis aproximativ 60 de milioane de europeni,</b> incluzand cinci monarhi <br>care conduceau europa in secolul al xviii-lea.pana la 30% din cei infectati,80% fiind copii sub 5 <br>ani,au murit datorita acestei boli si inca o treime din supravietuitori au devenit orbi. </div> <br> <br> <div> cat despre tarile din america,dupa primul contact cu europenii si africanii,unii au crezut ca rata <br>de mortalitate de 90-95% populatiei native din lumea noua fost cauza de boala lumii vechi. <br>se suspecteaza ca variola fost principalul vinovat si raspunzator pentru uciderea aproape toti <br>locuitorii nativi ai americii.in mexic,cand aztecii s-au angajat in rascoala impotriva lui cortés, <br>depasiti numeric,spaniolii au fost fortati sa fuga.in timpul luptei,un soldat spaniol purtator de <br>variola murit.dupa lupta,aztecii au contractat virusul din cadavrele invadatorilor.cand cortés <br>s-a intors in capitala,variola devastat populatia azteca.a ucis o mare parte din armata azteca, <br>imparatul si 25% din populatia normala.ulterior,cortés infrant cu usurinta aztecii si intrat in <br>tenochtitlán unde aflat ca variola ucis mai multi azteci decat au ucis tunurile. </div> <br> <br> <div> variola fost responsabila pentru aproximativ 300-500 de milioane de decese in secolul al xx-lea. <br>nu mai tarziu de 1967, organizatia mondiala sanatatii (oms) estimat ca 15 milioane de persoane <br>au contractat virusul si ca alte doua milioane au murit in acel an.dupa campanii de vaccinare incheiate <br>cu succes in timpul secolelor xix si xx,oms-ul oficializat eradicarea variolei in 1979.pana in ziua de <br>astazi,variola este singura boala infectioasa care fost complet eradicata din natura. </div> <img class="variola" src="http://s3.postimg.org/cb0l49sw3/variola.jpg" style="position:absolute; left:150px;"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <div class="cerculet"> <div style="font-family: cambria; font-size: 120%"> 2 </div> </div> <!-- aici folosit css-ul pentru da united nations stil imaginii urmat de codul html specific imaginii "style="position...." pentru aseza imaginea in pozitia dorita de mine --> </body> </html>
as can see, after number 1(colored in black,in circle),there's lot of space don't want.
the alignment not too.i used lots of   , <br>'s because can't find way set text after number 1. i'm trying create "site" school project , allowed see other sites "inspire" myself.you can check http://www.oddee.com/item_90608.aspx
and see i'm trying "copy" in kind of way.
please help.
in short, want float: left number/circle content wraps around it. have several unnecessary elements and, mentioned, unnecessary elements - below, i've cleaned illustration downwards bare-bones working example.
class="snippet-code-css lang-css prettyprint-override">.cerculet { display: block; } .cerculet:after { display: block; clear: both; content: ' '; } .cerculet p{ font-weight: bold; } .cerculet h2{ font-size: 120%; line-height: 145%; width: 1.6em; height: 1.6em; text-align: center; border-radius: 50%; background-color: black; color: white; white-space: nowrap; float: left; margin-right: 15px; } class="snippet-code-html lang-html prettyprint-override"><div class="cerculet"> <h2>1 </h1> <p>a ucis mai mult de 300 de milioane de oameni din intreaga lume in secolul al xx-lea si pe cei mai multi locuitori nativi ai americii. </p> </div> <p>variola(cunoscuta si sub numele latin "variola" sau "variola vera") este o boala contagioasa unica oamenilor.variola este cauza fie de virusul numit variola major,fie de cel numit variola minor.forma mai letala,v. major,are o mortalitate de 30-35%,pe cand v. minor este o forma mai usoara bolii numita alastrim si ucide ~1% din victimele sale.efectele secundare de termen lung pentru supravietuitori includ cicatrici pe piele.alte efecte secundare ocazionale includ orbire datorita ulcerului de cornee si infertilitate la persoanele de sex masculin. </p> <p><b>variola ucis aproximativ 60 de milioane de europeni,</b> incluzand cinci monarhi care conduceau europa in secolul al xviii-lea.pana la 30% din cei infectati,80% fiind copii sub 5 ani,au murit datorita acestei boli si inca o treime din supravietuitori au devenit orbi. </p>
html css
Comments
Post a Comment