Partage

mettre un bloc de texte devant un texte

2 janvier 2018 à 11:41:53

Bonjour,

Je souhaiterais mettre un bloc de texte (float:right) par dessus des lignes qui servent de séparation entre 2 textes, et je n'y arrive pas

Est-ce que quelqu'un pourrait m'aider ?

Merci

Vous êtes demandeur·se d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur·se web junior

Je postule
Formation
courte
Financée
à 100%
Staff 2 janvier 2018 à 11:58:05

Bonjour,

il nous faut absolument ton code HTML et CSS, personne n'est devin ici. L'idéal serait aussi un schéma de ce que tu attends : tu parles d'un bloc de texte "au-dessus" de quelque chose mais précise en "float", ce n'est pas facile de comprendre ce que tu veux.

Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
2 janvier 2018 à 12:00:11

fait voir ton code pour trouver des solutions
2 janvier 2018 à 12:13:52

Ok pardon pardon je suis débutante donc voici le code du bloc que j'aimerais positionner sur une ligne

<div style="float:right;background:#FF0000;width:300px;height:210px;padding:5px">
<h1 align="center"><u><strong><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size: 14px;">Liste des pi&egrave;ces &agrave; fournir</span></span></strong></u></h1>

<p>Pour une demande de copie int&eacute;grale ou extrait <u>avec</u> filiation :</p>

<ul>
    <li>Vous devez &ecirc;tre en mesure d&#39;indiquer la filiation (nom et pr&eacute;nom du p&egrave;re et nom de naissance et pr&eacute;nom de la m&egrave;re) de la personne concern&eacute;e par l&#39;acte et de justifier de votre qualit&eacute; pour l&#39;obtenir.</li>
</ul>

<p>Pour une demande d&#39;extrait <u>sans</u> filiation :</p>

<ul>
    <li>Aucun document n&#39;est exig&eacute;</li>
</ul>

<p>&nbsp;</p>
</div>

et voici le code de la ligne

<p><span style="font-size:16px;"><strong>Principes</strong><strong> :</strong></span></p>

et voila le rendui que je souhaite.

merci pour votre aide

-
Edité par VéroniqueGauthier 2 janvier 2018 à 14:01:53

2 janvier 2018 à 12:46:29

utilise le botuon code stp qui est juste en haut de l'editeur </>

-
Edité par Mr_LeDeveloppeur 2 janvier 2018 à 12:46:37

2 janvier 2018 à 13:33:27

Bonjour VéroniqueGauthier, tu pourrais pousser un peu plus dans tes explications car j'ai peur que ça ne soit pas assez clair ce que tu souhaite faire...
2 janvier 2018 à 13:37:52

Je ne sais pas si c'est ca que tu me demande mais j'ai pas trouvé mieux

   <h2 style="text-align: center;"><span style="font-family:arial,helvetica,sans-serif;">demande d&#39;acte de d&eacute;c&egrave;s </span></h2>

<p>&nbsp;</p>

<table border="0" cellpadding="1" cellspacing="1" height="28" width="1216">
    <tbody>
        <tr>
            <td>
            <p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
            </td>
        </tr>
    </tbody>
</table>

<div style="float:right;background:#FF0000;width:300px;height:150px;padding:5px">
<h1 align="center"><strong><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size: 14px;">Liste des pi&egrave;ces &agrave; fournir</span></span></strong></h1>

<p><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size: 12px;">aucune pi&egrave;ce n&#39;est exig&eacute;e</span></span></p>

<p>&nbsp;</p>
</div>

<p><span style="font-size:16px;"><strong>Principes</strong><strong> :</strong></span></p>

<p>En droit fran&ccedil;ais, le terme acte d&#39;&eacute;tat civil renvoie au document officiel attestant la naissance, le mariage ou le d&eacute;c&egrave;s d&#39;une personne physique. Il s&#39;agit d&#39;un acte authentique dress&eacute; et sign&eacute; par l&#39;officier de l&#39;&eacute;tat civil. Il est compl&eacute;t&eacute; par des mentions marginales &agrave; la suite d&#39;un nouvel &eacute;v&eacute;nement (mariage, jugement de divorce, reconnaissance, d&eacute;c&egrave;s, s&eacute;paration de corps, acte de notori&eacute;t&eacute;...)</p>

<p>La d&eacute;livrance de ces actes est soumise &agrave; une stricte r&eacute;glementation. Ainsi, la copie dite &quot;int&eacute;grale&quot; ou extrait d&#39;acte &quot;avec filiation&quot; de naissance ou de mariage est d&eacute;livr&eacute;e uniquement &agrave; l&#39;int&eacute;ress&eacute;(e), aux ascendants et descendants directs, aux &eacute;poux, aux partenaires li&eacute;s par un PACS et organismes qui y ont droit.</p>

<p><strong>Les acte de d&eacute;c&egrave;s et les actes &quot;sans filiation&quot; qui sont transmissibles &agrave; toutes personnes.</strong></p>

<p>Vous &ecirc;tes concern&eacute;s si la demande d&#39;acte concerne un d&eacute;c&egrave;s survenu &agrave; Joinville-le-Pont.</p>

<table border="0" cellpadding="1" cellspacing="1" height="28" width="1216">
    <tbody>
        <tr>
            <td>
            <p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
            </td>
        </tr>
    </tbody>
</table>

<p><span style="font-size:16px;"><strong>M&eacute;thode pour faire sa demande</strong><strong> :</strong></span></p>

<p>Vous avez trois possibilit&eacute;s :</p>

<ul>
    <li>En ligne, par l&#39;interm&eacute;diaire du formulaire ci-dessous, cliquer sur &quot;Commencer&quot;,</li>
    <li>Par courrier, en indiquant sur papier libre, l&#39;&eacute;tat civil de la personne concern&eacute;e par l&#39;acte (nom, pr&eacute;nom, date de l&#39;&eacute;v&eacute;nement : naissance, mariage ou d&eacute;c&egrave;s, et sa filiation), en y joignant une enveloppe timbr&eacute;e pour le retour,</li>
    <li>En mairie, aupr&egrave;s de nos services, sur pr&eacute;sentation d&#39;une pi&egrave;ce d&#39;identit&eacute;.</li>
</ul>

<p>Pour &ecirc;tre valable, ce document ne doit pas &ecirc;tre photocopi&eacute; ou scann&eacute; et &ecirc;tre dat&eacute; de moins de 3 mois, sous peine de rejet par l&#39;organisme demandeur.</p>

<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>

<p><span style="font-size:16px;"><strong>Tarifs :</strong></span></p>

<p>Proc&eacute;dure gratuite</p>

<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>

<p><span style="font-size:16px;"><strong>D&eacute;lais d&#39;obtention :</strong></span></p>

<p>Imm&eacute;diat en mairie, le d&eacute;lai est de 5 &agrave; 7 jours en moyenne par acheminement postal.</p>

<table border="0" cellpadding="1" cellspacing="1" height="28" width="1216">
    <tbody>
        <tr>
            <td>
            <p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
            </td>
        </tr>
    </tbody>
</table>

<p><span style="font-size:16px;"><strong>Contact :</strong></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Horaire d&#39;accueil du public :</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Lundi Mardi Mercredi de 8h30 &agrave; 12h et de 13hg30 &agrave; 17h30</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Jeudi de 13h30 &agrave; 17h30</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Vendredi de 8h30 &agrave; 12h et de 13h30 &agrave; 17h</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Samedi de 8h30 &agrave; 12h sauf vacances scolaires et pont</span></span></p>

<p style="text-align: right;"><span style="font-family:trebuchet ms,helvetica,sans-serif;"><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;"><em><strong>R</strong></em></span></span><span style="color: rgb(128, 128, 128);"><span style="font-size: 12px;"><em><strong>enseignements :</strong></em><strong> </strong></span></span><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;"><strong>G</strong></span></span><span style="color: rgb(128, 128, 128);"><span style="font-size: 12px;">uichet</span></span><span style="color: rgb(169, 169, 169);"><span style="font-size: 12px;"> </span></span><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;"><strong>U</strong></span></span><span style="color: rgb(128, 128, 128);"><span style="font-size: 12px;">nique</span></span><br />
<strong><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;">T</span></span></strong><span style="color: rgb(105, 105, 105);"><span style="font-size: 12px;">&eacute;l. : <a href="tel:01.49.76.60.00">01.49.76.60.00</a></span></span></span></p>

<p style="text-align: right;"><span style="font-family:trebuchet ms,helvetica,sans-serif;"><strong><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;">M</span></span></strong><span style="color: rgb(105, 105, 105);"><span style="font-size: 12px;">essagerie : guichetunique@joinvillelepont.fr</span></span></span></p>

<p align="justify">&nbsp;</p>

<p>&nbsp;</p>
           

2 janvier 2018 à 13:45:55

Bonjour,

Premièrement, il faut vraiment utiliser le bouton "</>" du forum pour partager ton code. Dans l'état c'est tout simplement illisible.

Ensuite je vois beaucoup de choses qui me font hurler dans ton code : mise en page en tableaux, styles inline, la multiplication absolument folle des entités HTML pour les espaces insécables ainsi que des balises <span> et <strong>, l'utilisation répétée d'attributs et de balises dépréciés depuis la fin des années 90, etc etc.

Je ne peux te conseiller qu'une seule chose : mets ton projet de côté et commence (ou recommence ?) le cours sur le HTML et le CSS depuis le début. Tu pourras ensuite revenir sur ton projet à tête reposée une fois que tu auras vu les notions de bases. 

C'est pour moi la meilleure solution car il y a actuellement beaucoup trop de problèmes dans ton code. Il faut absolument tout reprendre depuis le début. T'aider à faire ce que tu veux reviendrait à mettre un pansement sur une jambe de bois comme on dit.

-
Edité par Mewen_bzh 2 janvier 2018 à 15:25:12

Recherche l'avis de développeurs front : Devenir un meilleur dev front ?
2 janvier 2018 à 16:28:46

<h2 style="text-align: center;"><span style="font-family:arial,helvetica,sans-serif;">demande d&#39;acte de mariage </span></h2>

<p>&nbsp;</p>

<table border="0" cellpadding="1" cellspacing="1" height="28" width="1216">
	<tbody>
		<tr>
			<td>
			<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
			</td>
		</tr>
	</tbody>
</table>

<div style="float:right;background:#FF0000;width:300px;height:210px;padding:5px">
<h1 align="center"><u><strong><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size: 14px;">Liste des pi&egrave;ces &agrave; fournir</span></span></strong></u></h1>

<p>Pour une demande de copie int&eacute;grale ou extrait <u>avec</u> filiation :</p>

<ul>
	<li>Vous devez &ecirc;tre en mesure d&#39;indiquer la filiation (nom et pr&eacute;nom du p&egrave;re et nom de naissance et pr&eacute;nom de la m&egrave;re) de la personne concern&eacute;e par l&#39;acte et de justifier de votre qualit&eacute; pour l&#39;obtenir.</li>
</ul>

<p>Pour une demande d&#39;extrait <u>sans</u> filiation :</p>

<ul>
	<li>Aucun document n&#39;est exig&eacute;</li>
</ul>

<p>&nbsp;</p>
</div>

<p><span style="font-size:16px;"><strong>Principes</strong><strong> :</strong></span></p>

<p>En droit fran&ccedil;ais, le terme acte d&#39;&eacute;tat civil renvoie au document officiel attestant la naissance, le mariage ou le d&eacute;c&egrave;s d&#39;une personne physique. Il s&#39;agit d&#39;un acte authentique dress&eacute; et sign&eacute; par l&#39;officier de l&#39;&eacute;tat civil. Il est compl&eacute;t&eacute; par des mentions marginales &agrave; la suite d&#39;un nouvel &eacute;v&eacute;nement (mariage, jugement de divorce, reconnaissance, d&eacute;c&egrave;s, s&eacute;paration de corps, acte de notori&eacute;t&eacute;...)</p>

<p>La d&eacute;livrance de ces actes est soumise &agrave; une stricte r&eacute;glementation. Ainsi, la copie dite &quot;int&eacute;grale&quot; ou extrait d&#39;acte &quot;avec filiation&quot; de mariage est d&eacute;livr&eacute;e uniquement &agrave; l&#39;int&eacute;ress&eacute;(e), aux ascendants et descendants directs, aux &eacute;poux et organismes qui y ont droit.</p>

<p>Les actes &quot;sans filiation&quot; sont transmissibles &agrave; toutes personnes.</p>

<p>Vous &ecirc;tes concern&eacute;s si la demande d&#39;acte concerne un mariage survenu &agrave; Joinville-le-Pont.</p>

<table border="0" cellpadding="1" cellspacing="1" height="21" width="1022">
	<tbody>
		<tr>
			<td>
			<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
			</td>
		</tr>
	</tbody>
</table>

<p><span style="font-size:16px;"><strong>M&eacute;thode pour faire sa demande</strong><strong> :</strong></span></p>

<p>Vous avez trois possibilit&eacute;s :</p>

<ul>
	<li>En ligne, par l&#39;interm&eacute;diaire du formulaire ci-dessous, cliquer sur &quot;Commencer&quot;,</li>
	<li>Par courrier, en indiquant sur papier libre, l&#39;&eacute;tat civil de la personne concern&eacute;e par l&#39;acte (nom, pr&eacute;nom, date de l&#39;&eacute;v&eacute;nement : naissance, mariage ou d&eacute;c&egrave;s, et sa filiation), en y joignant une enveloppe timbr&eacute;e pour le retour,</li>
	<li>En mairie, aupr&egrave;s de nos services, sur pr&eacute;sentation d&#39;une pi&egrave;ce d&#39;identit&eacute;.</li>
</ul>

<p>Pour &ecirc;tre valable, ce document ne doit pas &ecirc;tre photocopi&eacute; ou scann&eacute; et &ecirc;tre dat&eacute; de moins de 3 mois, sous peine de rejet par l&#39;organisme demandeur.</p>

<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>

<p><span style="font-size:16px;"><strong>Tarifs :</strong></span></p>

<p>Proc&eacute;dure gratuite</p>

<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>

<p><span style="font-size:16px;"><strong>D&eacute;lais d&#39;obtention :</strong></span></p>

<p>Imm&eacute;diat en mairie, le d&eacute;lai est de 5 &agrave; 7 jours en moyenne par acheminement postal.</p>

<table border="0" cellpadding="1" cellspacing="1" height="28" width="1216">
	<tbody>
		<tr>
			<td>
			<p style="text-align: justify;"><span style="font-size:16px;"><strong><span style="background-color:#0000CD;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="background-color:#0000FF;"><span style="background-color:#ADD8E6;"> </span></span></strong></span></p>
			</td>
		</tr>
	</tbody>
</table>

<p><span style="font-size:16px;"><strong>Contact :</strong></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;"><strong>H</strong>oraire d&#39;accueil du public :</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Lundi Mardi Mercredi de 8h30 &agrave; 12h et de 13hg30 &agrave; 17h30</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Jeudi de 13h30 &agrave; 17h30</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Vendredi de 8h30 &agrave; 12h et de 13h30 &agrave; 17h</span></span></p>

<p><span style="color:#696969;"><span style="font-family: arial, helvetica, sans-serif;">Le Samedi de 8h30 &agrave; 12h sauf vacances scolaires et pont</span></span></p>

<p><br />
<span style="font-family:trebuchet ms,helvetica,sans-serif;"><strong><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;">T</span></span></strong><span style="color: rgb(105, 105, 105);"><span style="font-size: 12px;">&eacute;l. : 01.49.76.60.00</span></span></span></p>

<p><span style="font-family:trebuchet ms,helvetica,sans-serif;"><strong><span style="color: rgb(0, 0, 0);"><span style="font-size: 12px;">M</span></span></strong><span style="color: rgb(105, 105, 105);"><span style="font-size: 12px;">essagerie : guichetunique@joinvillelepont.fr</span></span></span></p>

<p align="justify">&nbsp;</p>

<p>&nbsp;</p>
2 janvier 2018 à 16:38:30

utilise l'encodage UTF-8 ca va t'eviter d'ecrire avec les sympboles : exemple

au lieu de faire ca "ex&eacutecute" utilise plutot UTF-8 et ecris "Execute"

2 janvier 2018 à 18:21:09

dans un premier temps on reprend les bases...

un code html se commence comme ceci :

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

et se fini par :

</body>
</html>

Le corps de ton code se trouve dans le body, mais ça tu le savais déjà je l’espère. :)

dans un second temps par pitié enlevè- moi ta panoplie de &nbsp; :colere:. En regardant ton code j’en déduit que tu veux créer des rectangles blues pour séparer tes textes et pour cela tu utilises un span que tu bombardes de &nbsp;.  La démarche n'est pas bonne du tout. si tu veux créer une séparation comme ça, utilises une div que tu stylises avec ton css du genre :

.tadiv{
    background-color:#0000CD;
    width: 30%; /*ici tu modifies la longueur*/
    height: 20px; /* ici la hauteur*/
}

ensuite tu n'es pas obligées d'utiliser un tableau pour ce que tu veux faire,

en prenant comme exemple ton premier paragraphe  :

<!DOCTYPE html>
<html>
<head>
    <title>Ton titre qui s'affiche sur l'onglet de page</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="ton chemin vers ton fichier .css">
</head>
<body>

<div style="width: 70%;">
<h1>Principes :</h1>
<p>En droit français, le terme acte d'état civil renvoie au document officiel attestant la naissance, le mariage ou le décès d'une personne physique. Il s'agit d'un acte authentique dressé et signé par l'officier de l'état civil. Il est complété par des mentions marginales à la suite d'un nouvel événement (mariage, jugement de divorce, reconnaissance, décès, séparation de corps, acte de notoriété...)<br><br>
La délivrance de ces actes est soumise à une stricte réglementation. Ainsi, la copie dite "intégrale" ou extrait d'acte "avec filiation" de mariage est délivrée uniquement à l'intéressé(e), aux ascendants et descendants directs, aux époux et organismes qui y ont droit.<br><br>
Les actes "sans filiation" sont transmissibles à toutes personnes.<br><br>
Vous êtes concernés si la demande d'acte concerne un mariage survenu à Joinville-le-Pont.
</p>
</div>

<div style="background-color:#0000CD;
    width: 30%; /*ici tu modifies la longueur*/
    height: 20px; /* ici la hauteur*/ ">    
</div>

<div style="width: 70%;">    
<h1>la suite :</h1>
</div>
</body>
</html>

(<br> c'est un retour à la ligne)

Enfin pour le carré rouge de droite tu enlèves tous tes espacements et tu utilises un float : right;

je te laisse y réfléchir et tu me montrera dès que tu auras fini :D

ps : N’hésites surtout pas à demander si certaines choses te sont flou dans mon code !


-
Edité par Clément Muth 2 janvier 2018 à 18:25:49

3 janvier 2018 à 7:57:01

Merci beaucoup Clément Ruth je vais essayer d'appliquer ça
3 janvier 2018 à 19:02:03

Pas de problème, n’hésites pas à envoyer ton code final pour que d'autres personnes qui auraient un problème similaire puisse comprendre
4 janvier 2018 à 13:25:36

Bonjour,

Voilà le résultat merci beaucoup Clément Muth

<h2 style="text-align: center;"><span style="font-family:arial,helvetica,sans-serif;">demande d&#39;acte de naissance </span></h2>

<p></p>

<div style="background-color:#0000cd;width:100%;height:15px"></div>

<div style="float:right;background:#EFEFEF;width:300px;height:210px;padding:6px;border-style:solid;border-color:#ff1a02;border-width:7px;">
<h1 align="center"><span style="color:#000000;"><u><strong><span style="font-family: arial, helvetica, sans-serif;"><span style="font-size: 14px;">Liste des pi&egrave;ces &agrave; fournir</span></span></strong></u></span></h1>

<p><em><strong><span style="color:#000000;">Pour une demande de copie int&eacute;grale ou extrait <u>avec</u> filiation :</span></strong></em></p>

<ul>
	<li><span style="color:#000000;">Vous devez &ecirc;tre en mesure d&#39;indiquer la filiation (nom et pr&eacute;nom du p&egrave;re et nom de naissance et pr&eacute;nom de la m&egrave;re) de la personne concern&eacute;e par l&#39;acte et de justifier de votre qualit&eacute; pour l&#39;obtenir.</span></li>
</ul>

<p><em><strong><span style="color:#000000;">Pour une demande d&#39;extrait <u>sans</u> filiation :</span></strong></em></p>

<ul>
	<li><span style="color:#000000;">Aucun document n&#39;est exig&eacute;</span></li>
</ul>

<p></p>
</div>

<p><span style="font-size:16px;"><strong>Principes</strong><strong> :</strong></span></p>

<p>En droit fran&ccedil;ais, le terme acte d&#39;&eacute;tat civil renvoie au document officiel attestant la naissance, le mariage ou le d&eacute;c&egrave;s d&#39;une personne physique. Il s&#39;agit d&#39;un acte authentique dress&eacute; et sign&eacute; par l&#39;officier de l&#39;&eacute;tat civil. Il est compl&eacute;t&eacute; par des mentions marginales &agrave; la suite d&#39;un nouvel &eacute;v&eacute;nement (mariage, jugement de divorce, reconnaissance, d&eacute;c&egrave;s, s&eacute;paration de corps, acte de notori&eacute;t&eacute;...)</p>

<p>La d&eacute;livrance de ces actes est soumise &agrave; une stricte r&eacute;glementation. Ainsi, la copie dite &quot;int&eacute;grale&quot; ou extrait d&#39;acte &quot;avec filiation&quot; de naissance est d&eacute;livr&eacute;e uniquement &agrave; l&#39;int&eacute;ress&eacute;(e), aux ascendants et descendants directs, aux &eacute;poux et aux partenaires li&eacute;s par un PACS et organismes qui y ont droit. Les actes &quot;sans filiation&quot; sont transmissibles &agrave; toutes personnes.</p>

<p>Vous &ecirc;tes concern&eacute;s si la demande d&#39;acte concerne une naissance survenu &agrave; Joinville-le-Pont.</p>

<div style="background-color:#0000cd;width:77%;height:15px"></div>


4 janvier 2018 à 14:49:24

C'est déjà mieux mais il y a encore des choses qui ne vont pas, la première chose qui saute aux yeux c'est les caractères comme $zs#.

je me demande si tu comprends ce que ça veux dire, ensuite évite d'utiliser style, css t'accueil  à bras ouvert pour tous ça. <em><strong> pareil -> css et comme je l'ai dit dans un précédant message un code ce commence et ce fini par 

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

</body>
</html>

et rajoute

<meta charset="utf-8">

Pour enlever tous ces symboles complètement illisible :)

-
Edité par Clément Muth 4 janvier 2018 à 14:53:28

4 janvier 2018 à 15:30:49

en gros tu dois avoir un truc de ce genre
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <title>TON TITRE</title>
</head>
<body>
<h2 style="text-align: center;"><span style="font-family:arial,helvetica,sans-serif;">demande d'acte de naissance </span></h2>
 
<p></p>
 
<div style="background-color:#0000cd;width:100%;height:15px"></div>
 
<div style="float:right;background:#EFEFEF;width:300px;height:210px;padding:6px;border-style:solid;border-color:#ff1a02;border-width:7px;">
<h1 align="center"><span style="color:#000000;"><u><strong><span style="font-family: arial, helvetica, sans-serif;"><span style="font-size: 14px;">Liste des pièces à fournir</span></span></strong></u></span></h1>
 
<p><em><strong><span style="color:#000000;">Pour une demande de copie intégrale ou extrait <u>avec</u> filiation :</span></strong></em></p>
 
<ul>
    <li><span style="color:#000000;">Vous devez être en mesure d'indiquer la filiation (nom et prénom du père et nom de naissance et prénom de la mère) de la personne concernée par l'acte et de justifier de votre qualité pour l'obtenir.</span></li>
</ul>
 
<p><em><strong><span style="color:#000000;">Pour une demande d'extrait <u>sans</u> filiation :</span></strong></em></p>
 
<ul>
    <li><span style="color:#000000;"> Aucun document n'est exigé </span></li>
</ul>
 
<p></p>
</div>
 
<p><span style="font-size:16px;"><strong>Principes</strong><strong> :</strong></span></p>
 
<p>En droit français, le terme acte d'état civil renvoie au document officiel attestant la naissance, le mariage ou le décès d'une personne physique. Il s'agit d'un acte authentique dressé et signé par l'officier de l'état civil. Il est complété par des mentions marginales à la suite d'un nouvel événement (mariage, jugement de divorce, reconnaissance, décès, séparation de corps, acte de notoriété...)</p>
 
<p>La délivrance de ces actes est soumise à une stricte réglementation. Ainsi, la copie dite "intégrale" ou extrait d'acte "avec filiation" de naissance est délivrée uniquement à l'intéressé(e), aux ascendants et descendants directs, aux époux et aux partenaires liés par un PACS et organismes qui y ont droit. Les actes "sans filiation" sont transmissibles à toutes personnes.</p>
 
<p>Vous êtes concernés si la demande d'acte concerne une naissance survenu à Joinville-le-Pont.</p>
 
<div style="background-color:#0000cd;width:77%;height:15px"></div>
</body>
</html>


mettre un bloc de texte devant un texte

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown