Remonter d'un étage une image de langue

Bonjour
Je reviens vers vous, car je rajoute un champ de recherche.
J'aimerais que tout soit aligné sur la même ligne mais je n'y arrive pas

div class="astroid-column col-lg-4 order-xl-0 order-lg-0 order-md-0 order-sm-0 order-0" id="ac-1091539321232502"><div class="astroid-module-position float-right" id="t2-691539321321578"> <nav class="moduletable "> <a class="btn btn-link jmodedit" href="https://preprod2.altius.fr/index.php?option=com_config&amp;view=modules&amp;id=87&amp;Itemid=124&amp;return=aHR0cHM6Ly9wcmVwcm9kMi5hbHRpdXMuZnIvZnIvaW5zdGFsbGVyL3Byb3RlY3Rpb24taW5kaXZpZHVlbGxlL3Byb3RlY3Rpb24taW5kaXZpZHVlbGxlLWxpZ25lLWRlLXZpZS1jYWJsZS5odG1s" target="_self" aria-describedby="tip-87">
	<span class="icon-edit" aria-hidden="true"></span><span class="visually-hidden">Modifier</span></a>
	<div role="tooltip" id="tip-87">Modifier le module<br>Changer de langue<br>Position: topbar-2</div>
         <div class="mod-languages">
    <p class="visually-hidden" id="language_picker_des_87">Sélectionnez votre langue</p>


    <ul aria-labelledby="language_picker_des_87" class="mod-languages__list lang-inline">

                                            <li class="lang-active">
                <a aria-current="true" href="https://preprod2.altius.fr/fr/installer/protection-individuelle/protection-individuelle-ligne-de-vie-cable.html">
                                                                        <img title="Français" src="/media/mod_languages/images/fr_fr.gif" alt="Français">                                                            </a>
            </li>
                                        <li>
                <a href="/en/">
                                                                        <img title="English (UK)" src="/media/mod_languages/images/en.gif" alt="English (UK)">                                                            </a>
            </li>
                </ul>

    <div class="mod-languages__posttext posttext"><p><a id="drap-suisse" href="http://altius-leman.ch/"><img src="/images/suisse_flag.png" alt="Drapeau Suisse"></a></p></div>
</div> </nav>  <header class="moduletable ">
         <div class="search">
	<form action="/fr/installer/protection-individuelle/protection-individuelle-ligne-de-vie-cable.html" method="post" class="form-group">
		<div class="input-group">
			<!-- <label for="mod-search-searchword94" class="element-invisible">Rechercher</label> --><input name="searchword" id="mod-search-searchword94" maxlength="200" class="inputbox form-control search-query input-medium" type="search" size="10" placeholder="Recherche..."> <div class="input-group-prepend"><button class="button btn btn-primary" onclick="this.form.searchword.focus();">OK</button></div>			<input type="hidden" name="task" value="search">
			<input type="hidden" name="option" value="com_search">
			<input type="hidden" name="Itemid" value="124">
		</div>
	</form>
</div> 

Modifié par HDcms (21 Aug 2023 - 17:10)

Bonjour
Quelqu'un peut-il m'aider?
@+

Bonjour/bonsoir,

En regardant ton code, je pense que nous sommes nombreux à se poser la question:

- pourquoi n'ajoute t-il pas ce nouveau lien à liste dédiée aux langages du site ?

<ul aria-labelledby="language_picker_des_87" class="mod-languages__list lang-inline">
  <li class="lang-active">
    <a aria-current="true" href="https://preprod2.altius.fr/fr/">
      <img title="Français" src="/media/mod_languages/images/fr_fr.gif" alt="Français">
    </a>
  </li>
  <li>
    <a href="/en/">
      <img title="English (UK)" src="/media/mod_languages/images/en.gif" alt="English (UK)">
    </a>
  </li>
  <li>
    <a id="drap-suisse" href="http://altius-leman.ch/">
      <img src="/images/suisse_flag.png" alt="Suisse (? français/italien ou allemand ?)" >
    </a>
  </li>
</ul>

Enfin, sans:
* les feuilles de styles
* l’éventuelle fonction d'un CMS utilisée pour insérer ce nouveau lien

Il est difficile de t'aider avec si peu d'info au départ.

On peut seulement te suggérer de compléter la structure existante , indiquer la langue (à priori pas fr) , voir , de ranger ce nouveau drapeau dans le même répertoire que les autres.

Cdt
Modifié par gcyrillus (25 Aug 2023 - 21:25)

Bonsoir
Je ne suis pas sûr de bien comprendre ce que tu veux dire.
J'ai des extensions différentes dans le cms :
* gestion français/anglais (url interne)
* langue suisse (lien externe autre extension
* autre extension de recherche dans le contenu
Du coup j'ai donné la structure HTML, car je ne vois pas comment faire autrement.
A part avoir donné cet id au drapeau suisse !
@+

HDcms a écrit :
Bonsoir
Je ne suis pas sûr de bien comprendre ce que tu veux dire.
@+

en gros :
a) -pourquoi voit-on apparaitre dans le HTML:

<div class="mod-languages__posttext posttext"><p><a id="drap-suisse" href="http://altius-leman.ch/"><img src="/images/suisse_flag.png" alt="Drapeau Suisse" /></a></p></div>

au lieu de voir un li ajouté à la liste.

b) - Pour la mise en forme, impossible de te proposer une correction ou une raison de l'affichage sans avoir le minimum du CSS impliqué

cdt
Bonne soirée

edit, si tu utilises un CMS, je ne sais pas duquel il s'agit(il y en a tellement), pour l'extension c'est encore plus flou
Modifié par gcyrillus (25 Aug 2023 - 21:27)

Bonjour
Toujours coincé.
Les bouts de code des éléments sont générés automatiquement par le cms joomla dans des modules différents (mais effectivement peu importe le cms.
Je peux juste ajouter à certains endroits côté back-offfice un id comme id="drap-suisse"
Chaque module a son propre css.
Ne peux-t-on pas réarranger cet HTML avec un code CSS approprié ? ou c'est treop compliqué ?

Bonjour
Je reviens vers vous car le drapeau suisse est bien remonté avec le code

a[href^="http://altius-leman.ch/"]{
  position: relative;
  top: -24px;
  left: 100px
}

Néanmoins j'aurai besoin de faire la même chose avec le champ recherche en le mettant à droite des drapeaux pour avoir une entête toute petite sur une seule ligne
Modifié par HDcms (01 Sep 2023 - 08:55)

Bonjour
Bon je reviens vers vous pour faire la même chose avec le champ recherche en le mettant à droite des drapeaux pour avoir une entête toute petite sur une seule ligne
@+