Problème de HTML

Messages postés
18
Date d'inscription
lundi 29 juillet 2019
Statut
Membre
Dernière intervention
31 juillet 2019
- - Dernière réponse : Reflexion38
Messages postés
44
Date d'inscription
dimanche 31 janvier 2016
Statut
Membre
Dernière intervention
17 août 2019
- 31 juil. 2019 à 17:58
Bonjour les ccm-nautes,
voilà j'essaie sur un site de radio placer l'élément 1 à coté de l'élément 2 :



Voici le code source, les deux élements se trouvent au commentaire : <!--OnlineRadioBox Top widget-->
<!DOCTYPE HTML>
<!--
	Dimension by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
	<head>
		<title>Lub radio | Hits frais tout au long de la journée</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
		<link rel="stylesheet" href="assets/css/main.css" />
		<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
	</head>
	<body class="is-preload">

		<!-- Wrapper -->
			<div id="wrapper">

				<!-- Header -->
					<header id="header">
						
						<div class="content">
							<div class="inner">
								<img src="images/lubradiologo.png" height="85" /> 
								<p>Lub radio, c'est la radio avec des hits frais tout au long de la journée, une programmation<br> de qualité, et toujours moins de pubs depuis 2015.</p>
							</div>
						</div>
						<nav>
							<ul>
								<li><a href="my/index.html">Demander une musique </a></li>
								<li><a href="#about">Recrutements</a></li>
								<li><a href="#prog">Programmation</a></li>
								<li><a href="#team">La team</a></li>
								<li><a href="#contact">Contact</a></li>
								<!--<li><a href="#elements">Elements</a></li>-->
							</ul>
						</nav>
						
					</header>
					<BR> 
					<!--OnlineRadioBox Player widget-->
<div class="orbP" id="orb_player_5e656b2edef82d32">
<style media="screen">
    /* General */
  .orbP{position:relative;box-sizing:border-box;overflow:hidden;font-weight:normal;border:1px solid transparent;user-select:none;text-align:left}.orbP br,.orbP>br{display:none!important;}.orbP p,.orbP>p{margin:0!important;padding:0!important;line-height:normal!important;font-size:inherit!important}.orbPh{display:block;position:absolute;z-index:100;top:50%;margin-top:-12px!important;right:10px;width:21px!important;text-decoration:none!important;cursor:pointer}.orbPh>img{margin:0!important;border:none;height:24px!important;-webkit-filter:drop-shadow(2px 2px 0 rgba(47,99,160,.2));filter:drop-shadow(2px 2px 0 rgba(47,99,160,.2))}.orbPt{text-decoration:none!important}.orbPti{float:left;margin:0 10px 0 0!important;vertical-align:top!important;height:48px!important;width:89px!important;border:none!important;border-radius:2px!important;opacity:1!important}.orbPtn{display:block;margin-right:52px;line-height:24px!important;font-size:17px!important;font-weight:bold!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.orbPtt{display:block;margin-right:52px;text-decoration:none!important;line-height:24px!important;font-size:12px!important;opacity:.85;transition:opacity .2s;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.orbPtt:hover{opacity:1}.orbPp,.orbPs{float:left!important;margin:0 10px 0 0!important;padding:0!important;height:48px!important;width:48px!important;line-height:48px!important;border-radius:2px!important;border:none!important;text-align:center!important;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none!important;}.orbPp::before,.orbPs::before{display:inline-block;vertical-align:middle;content:'';width:0;height:0;border-style:solid}.orbPp::before{border-width:16px 0 16px 26px}.orbPs::before{border-width:16px}.orbPp:focus,.orbPs:focus{outline-style:solid;outline-width:thin}.orbPp:hover,.orbPs:hover{-webkit-transform:scale(1.087);transform:scale(1.087)}.orbPhc{position:relative!important;box-sizing:border-box!important;padding:10px!important;overflow:hidden}
    /* Playlist */
  .orbPpl{position:relative;overflow:auto;overflow-x:hidden;overflow-y:auto;margin:0!important;padding:0!important;list-style:none!important}.orbPpli{box-sizing:border-box;margin:0!important;padding:0 10px!important;list-style:none!important;background-image:none;float:none!important;height: auto!important}.orbPpli>a,.orbPpli>span{display:block!important;padding:0!important;margin:0!important;height:auto!important;font-weight:normal!important;text-decoration:none!important;line-height:32px!important;font-size:14px!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:color .125s;border:none !important}.orbPpli>a:hover,.orbPpli>span:hover{background:transparent!important}.orbPpli>a>time,.orbPpli>span>time{display:inline-block;font-size:12px!important;width:3em!important}.orbPpli+li{border-style:solid!important;border-width:1px 0 0!important}
    /* Volume */
    .orbV{position:absolute;z-index:1!important;width:24px!important;right:48px!important;top:0!important;bottom:0!important;line-height:1!important;overflow:hidden!important;transition:width .3s}.orbV:hover{width:160px!important}.orbVC{position:absolute!important;height:18px!important;left:24px!important;top:50%!important;margin:-9px 0 0 11px!important}.orbVC::after{display:block;content:'';margin-top:4px;width:0;height:0;border-style:solid;border-width:4px 100px 4px 0;opacity:.33}.orbVCs{position:absolute!important;z-index:2!important;top:0!important;width:18px!important;height:18px!important;border-radius:50%!important;cursor:ew-resize!important;box-shadow:0 6px 8px -2px rgba(0,9,18,0.36)}.orbVb{position:absolute!important;width:24px!important;height:24px!important;top:50%!important;left:0!important;margin-top:-12px;white-space:nowrap!important;cursor:pointer;transition:opacity .3s}.orbVb::before{display:inline-block;content:'';vertical-align:middle;width:7px;height:12px}.orbVb::after{display:inline-block;content:'';vertical-align:middle;border-width:12px 12px 12px 0;border-style:solid;height:0;width:0;margin-left:-6px}.orbV:hover .orbVb{opacity:.33!important;cursor:default}.orbVb>._m{display: block!important;width:7px!important;height:18px!important;position:absolute!important;top:50%;margin-top:-9px!important;right:0; overflow: hidden!important;}.orbVb>._m::before{display:block;content:'';position:absolute;right:0;top:50%;width:28px;height:24px;margin-top:-12px;border:1px solid;border-radius:50%}.orbVb>._m::after{display:block;content:'';position:absolute;right:4px;top:50%;width:14px;height:14px;margin-top:-7px;border:1px solid;border-radius:50%}
    /* Flags*/
  .orbF{padding:0 0 10px 10px!important;border-top:1px solid;display:-ms-flexbox;display:-webkit-box;display:flex;-ms-flex-flow:row nowrap!important;flex-flow:row nowrap!important}
  .orbFl{margin:0!important;padding:0!important;list-style:none!important}
  .orbFli,.orbFh{display:inline-block!important;vertical-align:top!important;line-height:18px!important;white-space:nowrap!important;margin:10px 7px 0 0!important;padding:0 6px 0 0!important;text-indent:0!important;list-style:none!important;font-size:11px!important;text-align:right}
  .orbFlif{float:left!important;width:27px!important;height:18px!important;margin-right:5px!important}
  .orbFhi{position:relative!important;display:inline-block!important;vertical-align:baseline!important;width:8px!important;height:9px!important;margin:0 8px 0 5px!important;border-style:solid!important;border-width:2px 1px 0 1px!important;border-radius:5px 5px 0 0!important;opacity:.5}
  .orbFhi::before,.orbFhi::after{display:block;content:'';position:absolute;bottom:-2px;width:0;height:3px;border-style:solid;border-width:2px;border-radius:3px}
  .orbFhi::before{left:-4px}.orbFhi::after{right:-4px}
    /* Multiselect */
  .orbPm{margin:0!important;padding:0!important;list-style:none!important}
  .orbPmi{position:relative;margin:0!important;padding:10px!important;list-style:none!important;border:dotted rgba(204,204,204,0.5);border-width:1px 0 0;font-size:12px!important;overflow:hidden;white-space:nowrap;line-height:1!important;cursor:pointer}
  .orbPmi::before{display:block;content:'';position:absolute;z-index:1;top:50%;right:10px;margin-top:-8px;width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;opacity:.5;filter:alpha(opacity=50);transition:opacity .2s;}
  .orbPmi:hover::before{opacity:1;filter:alpha(opacity=100)}
  .orbPmi::after{display:block;content:'';position:absolute;top:0;bottom:0;right:0;width:36px}
  .orbPmii{display:inline-block;vertical-align:middle;margin-right:10px;width:30px;height:16px;border:none!important;border-radius:2px!important}
  .orbPmin{display:inline-block;vertical-align:middle;}

    /* Compact General */
  .cmpct .orbPti{height:24px!important;width:44px!important}
  .cmpct .orbPtn{line-height:12px!important;font-size:12px!important}
  .cmpct .orbPtt{line-height:12px!important;font-size:10px!important}
  .cmpct .orbPp,.cmpct .orbPs{height:24px!important;width:24px!important;line-height:24px!important}
  .cmpct .orbPp::before{border-width:8px 0 8px 13px !important}
  .cmpct .orbPs::before{border-width:8px !important}
    /* Compact w/Playlist */
  .cmpct .orbPpli>a,.cmpct .orbPpli>span{line-height:24px!important;font-size:12px!important}
  .cmpct .orbPpli>a>time,.cmpct .orbPpli>span>time{font-size:11px!important}

</style>
<style media="screen" id="orb_player_5e656b2edef82d32_settings">.orbP{background-color:#ffde59 !important;}/*common player background*/.orbP{border:none;}/*common player container border, radius, width*/.orbPp,.orbPs{background:#7094bf !important}/*buttons play/stop bg*/.orbPp::before{border-color:transparent transparent transparent #ffffff !important} /* play button color */.orbPp:focus,.orbPs:focus{outline-color:#ffffff}.orbPs::before{border-color:#ffffff !important} /* stop button color */.orbPtn,.orbPtt,.orbPtt:hover{color:#000000 !important;}/*station name & track link color*/.orbPpl{height:503px;background:#ffffff !important;}/*playlist height, playlist bg */.orbPpli>a,.orbPpli>a:visited,.orbPpli>span,.orbPpli>a:hover>time,.orbPpli.a>a>time,.orbPpli.a>span>time{color:#444444 !important;} /* playlist items color */.orbPpli>a:hover,.orbPpli.a>a,.orbPpli.a>span{color:#f07700 !important;} /* active-item color */.orbPpli>a>time,.orbPpli>span>time{color:#aeaeae !important;} /* item time color */.orbPpli.a{background:#f3f3f3 !important;} /* active-item bg */.orbPpli+li{border-color:#eeeeee !important;} /* item border color */.orbV{background-color:#ffde59 !important;box-shadow:0 0 32px 32px #ffde59 !important}/*volume control color */.orbVC::after,.orbVb::after{border-color:transparent #ffffff transparent transparent !important}.orbVb::before,.orbVCs{background:#ffffff !important} /* volume bg color */.orbVb>._m::before,.orbVb>._m::after{border-color:#ffffff !important}</style>
<div class="orbPhc">
  <a class="orbPh" href="https://onlineradiobox.com/fr/" title="Radio en ligne" target="_blank"><img src="//ecdn.onlineradiobox.com/img/wl.svg" alt="Radio en ligne"></a>
<audio id="orb_player_5e656b2edef82d32_p" crossorigin="true" style="width:1px;height:1px;overflow:hidden;position:absolute;"></audio>

  <button class="orbPp" title="Écouter" country="fr" alias="lub" stream="1" autoplay="autoplay"></button>
  <a class="orbPt" href="https://onlineradiobox.com/fr/lub/" target="_blank">
    <img class="orbPti" src="//cdn.onlineradiobox.com/img/logo/2/79252.v3.png" alt="Lub Radio">
    <span class="orbPtn">Lub Radio</span>
  </a>
  <span class="orbPtt" loading="Chargement" playing="En ce moment" error="Jeu d'erreur" not_supported="this browser can't play it" external="Ecoutez maintenant (Ouvre un lecteur dans une nouvelle fenêtre)"></span>
  <div class="orbV"><div class="orbVb"><i class="_m"></i></div><div class="orbVC"><div class="orbVCs" style="left: 80%;"></div></div></div>
</div>
<ul class="orbPpl"></ul>

<script>
  var orbp_w = orbp_w || { lang: "fr-fr" };
  orbp_w.cmd = orbp_w.cmd || [];
  orbp_w.cmd.push(function() {
    orbp_w.init("orb_player_5e656b2edef82d32");
  });
  var s, t; s = document.createElement('script'); s.type = 'text/javascript';
s.src = "//ecdn.onlineradiobox.com/js/pwidget2.min.235ca64e.js";
  t = document.getElementsByTagName('script')[0]; t.parentNode.insertBefore(s, t);
</script>
</div>

<!--OnlineRadioBox Top widget-->
<div class="orbC" id="orb_top_3f65438941657062">
    <style media="screen">
    .orbC{position:relative;box-sizing:border-box;overflow:hidden;font-weight:normal;border:1px solid;text-align:left}.orbC br,.orbC>br{display:none!important;}.orbC p,.orbC>p{margin:0!important;padding:0!important;line-height:normal!important;font-size:inherit!important}.orbC br,.orbC>br{display:none!important}.orbCh{display:block;position:absolute;z-index:100;top:22px;right:10px;margin-top:-12px;width:21px;text-decoration:none!important;cursor:pointer}.orbCh>img{margin:0!important;border:none!important;height:24px!important;-webkit-filter:drop-shadow(2px 2px 0 rgba(47,99,160,.2));filter:drop-shadow(2px 2px 0 rgba(47,99,160,.2))}.orbCt{display:block;box-sizing:border-box;overflow:hidden;padding-left:10px!important;font-weight:normal;line-height:44px!important;min-height:44px;text-decoration:none!important}.orbCti{float:left!important;margin:10px 10px 10px 0!important;height:24px!important;width:44px!important;border:none!important;border-radius:2px!important;opacity:1!important}.orbCtn{display:block;margin-right:54px!important;font-size:14px!important;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.orbIC{position:relative;overflow:auto;overflow-x:hidden;overflow-y:auto;margin:0!important;padding:5px 0!important;list-style:none!important;height:auto!important;float:none!important}.orbICi{box-sizing:border-box;margin:0!important;padding:5px 10px!important;list-style:none!important;background-image:none}.orbICi>a,.orbICi>span{display:block!important;font-weight:normal!important;text-decoration:none!important;font-size:16px!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;-webkit-transition:color .125s;transition:color .125s;height:auto!important;border:none!important}.orbICin{display:inline-block!important;vertical-align:middle!important;position:relative;height:40px!important;width:40px!important;margin:0 10px 0 0!important;text-align:center!important;line-height:40px!important;font-size:24px!important;border-radius:50%;background:rgba(220,220,220,.25)!important;box-shadow:0 0 0 1px rgba(0,0,0,.035)inset}.orbICin[data-dynamics]::after{display:block;position:absolute;content:'';right:-6px;width:16px;height:16px;border-radius:50%;background-color:rgba(255,255,255,.85);box-shadow:0 0 0 1px rgba(204,204,204,0.4)inset;background-repeat:no-repeat;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNDhweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgNDggMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDQ4IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjRkRCRTEzIiBkPSJNNDQuNyw2LjZsLTIuOS0wLjRsLTEuMy0yLjZsLTEuMywyLjZsLTIuOSwwLjRsMi4xLDJsLTAuNSwyLjlsMi42LTEuNGwyLjYsMS40bC0wLjUtMi45TDQ0LjcsNi42TDQ0LjcsNi42eiIvPjxwYXRoIGZpbGw9IiMzNUFCNjgiIGQ9Ik0xMS45LDcuMkw4LjgsNC4xQzguOCw0LDguNiw0LDguNSw0QzguNCw0LDguMyw0LDguMiw0LjFMNS4xLDcuMkM0LjksNy40LDUsNy42LDUuMiw3LjhzMC41LDAuMiwwLjYsMC4xIEw4LDUuN3Y1LjhDOCwxMS44LDguMiwxMiw4LjUsMTJTOSwxMS44LDksMTEuNVY1LjdsMi4yLDIuMmMwLjEsMC4xLDAuNCwwLjEsMC42LTAuMVMxMi4xLDcuNCwxMS45LDcuMnoiLz48cGF0aCBmaWxsPSIjRDk1MzRGIiBkPSJNMjcuOSw4LjhsLTMuMSwzLjFDMjQuOCwxMiwyNC42LDEyLDI0LjUsMTJjLTAuMSwwLTAuMiwwLTAuMy0wLjFsLTMuMS0zLjFjLTAuMS0wLjEtMC4xLTAuNCwwLjEtMC42IGMwLjItMC4yLDAuNS0wLjIsMC42LTAuMWwyLjIsMi4yVjQuNUMyNCw0LjIsMjQuMiw0LDI0LjUsNFMyNSw0LjIsMjUsNC41djUuOGwyLjItMi4yYzAuMS0wLjEsMC40LTAuMSwwLjYsMC4xIEMyOCw4LjQsMjguMSw4LjYsMjcuOSw4Ljh6Ii8+PC9zdmc+)}.orbICin[data-dynamics="up"]::after{top:0;background-position:0 50%}.orbICin[data-dynamics="down"]::after{bottom:0;background-position:50% 50%}.orbICin[data-dynamics="new"]::after{top:50%;margin-top:-8px;background-position:100% 50%}.orbICii{display:inline-block;vertical-align:middle!important;margin:0 6px 0 0!important;border-radius:4px!important;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xNDMgNTU3IDQ4IDQ4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IC0xNDMgNTU3IDQ4IDQ4IiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBvcGFjaXR5PSIwLjI0IiBmaWxsPSIjQ0NDQ0NDIiBkPSJNLTEwNiw1NjNsLTE5LDUuNHYyMC40Yy0xLjUtMC43LTMuNy0wLjctNS43LDAuMWMtMy4yLDEuMy01LDQuMi00LjEsNi42IGMwLjksMi4zLDQuNCwzLjIsNy42LDEuOWMzLjItMS4zLDQuMS0zLjQsNC4xLTYuNVY1NzZsMTUtNC40djExLjdjLTEuNS0wLjgtMy42LTAuOS01LjcsMGMtMy4yLDEuMy01LDQuMi00LjEsNi42czQuMiwzLjIsNy40LDEuOSBjMi43LTEuMSw0LjMtMi43LDQuMy01LjRoMFY1NjN6Ii8+PC9zdmc+)no-repeat 50% 50%!important;overflow:hidden!important;height:48px!important;width:48px!important;box-shadow:0 0 0 1px rgba(204,204,204,.33)inset}.orbICii>img{vertical-align:top!important;height:100%!important;width:100%!important}.orbICi+li{border-style:solid!important;border-width:1px 0 0!important} /* Compact */
      .cmpct .orbICi>a,.cmpct .orbICi>span{font-size:12px!important}
      .cmpct .orbICin{height:24px!important;width:24px!important;margin:0 6px 0 0!important;line-height:24px!important;font-size:16px!important}
      .cmpct .orbICin[data-dynamics]::after{right:-6px;width:12px;height:12px}
      .cmpct .orbICin[data-dynamics="up"]::after{top:0;background-position:-2px 50%}
      .cmpct .orbICin[data-dynamics="down"]::after{bottom:0}
      .cmpct .orbICin[data-dynamics="new"]::after{top:50%;margin-top:-8px;background-position:95% 50%}
      .cmpct .orbICii{height:24px!important;width:24px!important;border-radius:3px!important;}
    </style>
    <style media="screen" id="orb_top_3f65438941657062_settings">/*user customization*/.orbICii{display:inline-block}.orbC{border:none;border-radius:5px;;background:#fff !important;width:500px}/*common list container border, radius, background, width*/.orbCt{background-color:#ffde59 !important}/*common list title bg*/.orbCtn{color:#000000 !important}/*common list title color*/.orbIC{height:458px}/*track list height: user height, f.e. 370px - 45px(title) */.orbIC,.orbICin[data-dynamics]::after{background-color:#ffffff !important} /* list bg, dynamic bg*/.orbICi>a,.orbICi>a:visited,.orbICi>span,.orbICi>a:hover>.orbICin{color:#444444 !important} /*item color, hover-item time color */.orbICi>a:hover{color:#f07700 !important} /*hover-item color */.orbICin{color:#aeaeae !important} /*item position color/bg */.orbICi+li{border-color:#eeeeee !important} /* item border color */</style>
    <a class="orbCh" href="https://onlineradiobox.com/fr/" title="Radio en ligne" target="_blank"><img src="//ecdn.onlineradiobox.com/img/wl.svg" alt="Radio en ligne"></a>
    <a class="orbCt" href="https://onlineradiobox.com/fr/lub/" target="_blank">
      <img class="orbCti" src="//cdn.onlineradiobox.com/img/logo/2/79252.v3.png" alt="Radio Roks"><span class="orbCtn">Le TOP 10 Lub radio</span>
    </a>
    <script>
      var orbtop_w = orbtop_w || { lang: "fr-fr" };
      orbtop_w.cmd = orbtop_w.cmd || [];
      orbtop_w.cmd.push(function() {
        orbtop_w.init("orb_top_3f65438941657062");
      });
      var s, t; s = document.createElement('script'); s.type = 'text/javascript';
      s.src = "//ecdn.onlineradiobox.com/js/topwidget.min.e8fea607.js";
      t = document.getElementsByTagName('script')[0]; t.parentNode.insertBefore(s, t);
    </script><ul class='orbIC' top='10'></ul></div>
<!--OnlineRadioBox Top widget-->

<!--OnlineRadioBox Player widget-->


				<!-- Main -->
					<div id="main">

						<!-- Intro -->
							<article id="about">
								<h2 class="major">Recrutements</h2>
								<span class="image main"><img src="images/pic01.jpg" alt="" /></span>
								<p>Lub radio est constament en recrutement et cherche de <mark>jeunes talents</mark> toujours plus motivé pour faire de cette radio un pilier du paysayse audiovisuel français.</p>
								<p>Ecris-nous vite : recrutement@lub-groupe.com</p>
							</article>

						<!-- Work -->
							<article id="prog">
<iframe id="inlineFrameExample"
    title="Inline Frame Example"
    width="730"
    height="500"
    src="programme.html">
</iframe>

				</article>

						<!-- About -->
							<article id="team">
								<h2 class="major">La team</h2>
								<img src="images/team/2.jpg" width="300" alt="" /><p>gtyhrtdtftgybhuzsesedrftgbyh</p>
												</article>

						<!-- Contact -->
							<article id="contact">
								<h2 class="major">Contact</h2>
								<form method="post" action="#">
									<div class="fields">
										<div class="field half">
											<label for="name">Name</label>
											<input type="text" name="name" id="name" />
										</div>
										<div class="field half">
											<label for="email">Email</label>
											<input type="text" name="email" id="email" />
										</div>
										<div class="field">
											<label for="message">Message</label>
											<textarea name="message" id="message" rows="4"></textarea>
										</div>
									</div>
									<ul class="actions">
										<li><input type="submit" value="Send Message" class="primary" /></li>
										<li><input type="reset" value="Reset" /></li>
									</ul>
								</form>
								<ul class="icons">
									<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
									<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
									<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
									<li><a href="#" class="icon brands fa-github"><span class="label">GitHub</span></a></li>
								</ul>
							</article>

						<!-- Elements -->
							<article id="elements">
								<h2 class="major">Elements</h2>

								<section>
									<h3 class="major">Text</h3>
									<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
									This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
									
[ect..............]


J'espère que j'ai été clair et merci d'avance pour votre aide.

Afficher la suite 

1 réponse

Messages postés
44
Date d'inscription
dimanche 31 janvier 2016
Statut
Membre
Dernière intervention
17 août 2019
3
0
Merci
J'ai survolé rapidement ton code, tu utilises des balises "div" qui sont de type "bloc" essaye de remplacer les deux parties qui contiennent tes "éléments 1 et 2" par des balises "span" qui sont de type "inline" .

Tu peux aussi le faire en CSS.
Commenter la réponse de Reflexion38