Elemte richtig anordnen

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

      Elemte richtig anordnen

      Elemte richtig anordnen
      Hey leute, ich muss für mein Praktikum auf unserer Wordpress Seite Sprachbuttons einbauen. Gesagt getan. Jetzt hab ich die 2 Links in die Header Php rein gemacht. Und sie sind auch rechts von der Seite nur nicht weit genug und auch viel zu Tief (fast in der Navi leiste)

      Kann mir jemand sagen wie ich das anstelle? Hier mal der Code von der header.php

      header.php

      PHP-Quellcode

      1. <?php
      2. /**
      3. * Header Template
      4. *
      5. * @package Mysitemyway
      6. * @subpackage Template
      7. */
      8. ?><!DOCTYPE html>
      9. <!--[if lt IE 7]> <html class="ie ie6 lte9 lte8 lte7" <?php language_attributes(); ?>> <![endif]-->
      10. <!--[if IE 7]> <html class="ie ie7 lte9 lte8 lte7" <?php language_attributes(); ?>> <![endif]-->
      11. <!--[if IE 8]> <html class="ie ie8 lte9 lte8" <?php language_attributes(); ?>> <![endif]-->
      12. <!--[if IE 9]> <html class="ie ie9 lte9" <?php language_attributes(); ?>> <![endif]-->
      13. <!--[if gt IE 9]> <html> <![endif]-->
      14. <!--[if !IE]><!--> <html <?php language_attributes(); ?>> <!--<![endif]-->
      15. <head>
      16. <meta charset="<?php bloginfo( 'charset' ); ?>" />
      17. <title><?php mysite_document_title(); ?></title>
      18. <link rel="profile" href="http://gmpg.org/xfn/11" />
      19. <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
      20. <?php mysite_head(); ?>
      21. <?php wp_head(); ?>
      22. </head>
      23. <body class="<?php mysite_body_class(); ?>">
      24. <div class="multibg"><div class="multibg"></div></div>
      25. <div id="body_inner">
      26. <?php mysite_before_header();
      27. ?><div id="header">
      28. <div id="header_inner">
      29. <!-- Customize function -->
      30. <div style="float:right;">
      31. <?php
      32. global $q_config;
      33. if(is_404()) $url = get_option('home'); else $url = '';
      34. echo '<ul id="headerMenuSystem">';
      35. foreach(qtrans_getSortedLanguages() as $language)
      36. {
      37. $link = qtrans_convertURL('', $language);
      38. if($_SERVER["HTTPS"] == "on")
      39. $link = preg_replace('#^http://#','https://', $link);
      40. echo '<a href="'.$link.'"';
      41. echo ' hreflang="'.$language.'" title="'.$q_config['language_name'][$language].'"';
      42. echo '><img src="..../flags/'.$language.'.png"><span';
      43. echo '>'.$q_config['language_name'][$language].'</span></a></li>';
      44. }
      45. echo '</ul>';
      46. ?>
      47. </div>
      48. <?php mysite_header();
      49. ?></div><!-- #header_inner -->
      50. </div><!-- #header -->
      51. <?php mysite_after_header();
      52. ?><div id="content">
      53. <div id="content_inner">
      54. <?php mysite_before_main();
      55. ?><div id="main">
      56. <div id="main_inner">
      57. <?php mysite_before_page_content(); ?>
      Alles anzeigen



      Und so sieht es auf der Page aus.

      Die betreffenden StyleSheet's wären noch praktisch. Oder gibts keine?

      Wo ist dein <li> -Tag?
      Ich seh nur den </li>

      Gruß
      florian0

      Dieser Beitrag wurde bereits 3 mal editiert, zuletzt von florian0 ()

      Hmm weiß ich net kenn mich net so aus.

      Den part hier hab ich im netz gefunden und eingefügt (bzw ein teil davon also das grundgerüst, nach rechts setzen war ich)

      <!-- Customize function -->
      <div style="float:right;">
      <?php
      global $q_config;
      if(is_404()) $url = get_option('home'); else $url = '';
      echo '<ul id="headerMenuSystem">';

      foreach(qtrans_getSortedLanguages() as $language)
      {
      $link = qtrans_convertURL('', $language);

      if($_SERVER["HTTPS"] == "on")
      $link = preg_replace('#^http://#','https://', $link);

      echo '<a href="'.$link.'"';
      echo ' hreflang="'.$language.'" title="'.$q_config['language_name'][$language].'"';
      echo '><img src="..../flags/'.$language.'.png"><span';
      echo '>'.$q_config['language_name'][$language].'</span></a></li>';
      }

      echo '</ul>';
      ?>
      </div>
      Ok ich hab das Prob. jetzt erst verstanden ...

      Ich seh grad ... ist es das Theme?
      themes.mysitemyway.com/method/
      Nimm position:absolute ... der ganze Header ist so aufgebaut.

      Sieht sogar ganz ok aus ...


      (Ist dein Code + 3px Padding auf den <span> und position: absolute)

      Gruß
      florian0
      Im Moment sieht dein html-Ergebniss etwa so aus:

      HTML-Quellcode

      1. <ul id="headerMenuSystem" class="langselect">
      2. <li><a href="#"><img src="deutsch.png"><span>Deutsch</span></li>
      3. <li><a href="#"><img src="englisch.png"><span>Englisch</span></li>
      4. </ul>

      Und ich hab eben dem <span> Element per CSS noch 3px Padding gegeben. Sonst klebte das so am Icon dran:

      CSS-Quellcode

      1. langselect.ul > li > a > span {
      2. padding: 3px;
      3. }
      4. /* Und halt das restliche Listen-Styling */
      5. langselect.ul {
      6. list-style-type: none; /* Punkte weg */
      7. }
      8. langselect.ul > li {
      9. display: inline; /* Elemente nebeneinander anzeigen */
      10. }
      Alles anzeigen
      In welche Datei kommt das rein?

      Style.css? oder in Themen bei General Settings->Custom CSS?

      Edit: Also muss ich auch das hier anpassen damit er es richtig aus dem CSS ließt?

      echo '<ul id="headerMenuSystem" class="langselect">'; [müsste so richtig sein oder?

      Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von trytokillme ()

      Jup.
      Und über die ID kannste dann per CSS die Position festlegen.

      Click me for a solution

      CSS-Quellcode

      1. #headerMenuSystem {
      2. position: absolute;
      3. top: 3px;
      4. right: 0;
      5. }

      Position: absolute is eigentlich nich so tolle. Aber der komplette Header basiert darauf, daher kann man da nicht viel machen ...