Dropdown-Menü Breite

  • Hallöchen,

    ich bin leider kein Profi in Sachen CSS, erstelle gerade eine Website für einen Kunden und es gibt im Template keinerlei Einstellungsmöglichkeiten für das Drop-Down-Menü.

    Wie man sieht sind bei den 2 letzten Unterpunkten der Text unter den Pfeil gerutscht. Wisst ihr, was ich da tun kann?

    Die Seite ist leider offline im Bearbeitungsmodus, sonst würde ich sie hier teilen.


    Liebe Grüße

  • Tja, schön blöd, wenn man von einem Kunden einen Auftrag annimmt, obwohl man keine Ahnung davon hat.



    Was für ein Template ist das? Ich gehe davon aus, dass man das per CSS anpassen kann, aber um das genauer sagen zu können, muss man sich das ansehen können.

  • Was für ein Forum ist das, wo man direkt grundlos gedisst wird? Oder bin ich hier an einen 16-jährigen Dödel geraten?
    Als Grafik-Designerin mit sehr guten Wordpress-Kenntnissen kann ich sehr wohl für Freunde Websites erstellen, ohne CSS können zu müssen. Ich verdiene mein Geld hauptberuflich mit anderen Dingen. Außerdem frag ich mich wozu es dieses Forum gibt, wenn nicht um Fragen zu stellen.


    Nun aber zum wichtigen Punkt.


    Lupus_III, danke für deine neutral gehaltene Antwort. Ich hoffe, dass das der richtige Bereich ist, den ich kopiert habe.


    .et_pb_menu_0_tb_header.et_pb_menu .nav li ul {

    1. background-color: #FFFFFF!important;
    2. border-color: #000000;

    }

    style.dev.c…4.9.0:11823
    .et_pb_menu .et_pb_menu__menu > nav > ul > li > ul, .et_pb_fullwidth_menu .et_pb_menu__menu > nav > ul > li > ul {

    1. /* top: calc(100% - 1px); */
    2. /* left: 0; */

    }

    style.dev.c…5.7.2:11821
    .et_pb_menu .et_pb_menu__menu > nav > ul > li > ul, .et_pb_fullwidth_menu .et_pb_menu__menu > nav > ul > li > ul {

    1. top: calc(100% - 1px);
    2. left: 0;

    }

    style.dev.c…4.9.0:11672
    .et_pb_menu .et-menu-nav > ul ul, .et_pb_fullwidth_menu .et-menu-nav > ul ul {

    1. padding: 20px 0;
    2. text-align: left;

    }

    style.dev.c…5.7.2:11671
    .et_pb_menu .et-menu-nav > ul ul, .et_pb_fullwidth_menu .et-menu-nav > ul ul {

    1. padding: 20px 0;
    2. text-align: left;

    }

    style.dev.c…=4.9.0:8350
    .nav li ul {

    1. -webkit-transform: translate3d(0, 0, 0);
    2. text-align: left;

    }

    style.dev.c…=4.9.0:8338
    .nav li ul {

    1. z-index: 9999;
    2. width: 300px;
    3. background: #fff;
    4. visibility: hidden;
    5. opacity: 0;
    6. border-top: 3px solid #2EA3F2;
    7. box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
    8. -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    9. -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 10%);

    }

    style.dev.c…=4.9.0:8333
    .nav li ul {

    1. position: absolute;
    2. padding: 20px 0;

    }

    style.dev.c…r=4.9.0:245
    .et-search-form, .nav li ul, .et_mobile_menu, .footer-widget li:before, blockquote {

    1. border-color: #2EA3F2;

    }

    style.dev.c…=5.7.2:8349
    .nav li ul {

    1. -webkit-transform: translate3d(0, 0, 0);
    2. text-align: left;

    }

    style.dev.c…=5.7.2:8337
    .nav li ul {

    1. z-index: 9999;
    2. width: 240px;
    3. background: #fff;
    4. visibility: hidden;
    5. opacity: 0;
    6. border-top: 3px solid #2EA3F2;
    7. box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
    8. -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    9. -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 10%);

    }

    style.dev.c…=5.7.2:8333
    .nav li ul {

    1. position: absolute;
    2. padding: 20px 0;

    }

    style.dev.c…r=5.7.2:245
    .et-search-form, .nav li ul, .et_mobile_menu, .footer-widget li:before, blockquote {

    1. border-color: #2EA3F2;

    }

    style.dev.c…r=4.9.0:478
    #left-area ul, .entry-content ul, .et-l--header ul, .et-l--body ul, .et-l--footer ul, .comment-content ul, body.et-pb-preview #main-content .container ul {

    1. /* list-style-type: disc; */
    2. padding: 0 0 23px 1em;
    3. line-height: 26px;

    }

    style.dev.c…r=5.7.2:478
    #left-area ul, .entry-content ul, .et-l--header ul, .et-l--body ul, .et-l--footer ul, .comment-content ul, body.et-pb-preview #main-content .container ul {

    1. list-style-type: disc;
    2. /* padding: 0 0 23px 1em; */
    3. line-height: 26px;

    }

    style.dev.c…er=4.9.0:28
    ol, ul {

    1. list-style: none;

    }

    style.dev.c…er=4.9.0:14
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {

    1. margin: 0;
    2. padding: 0;
    3. border: 0;
    4. outline: 0;
    5. font-size: 100%;
    6. -ms-text-size-adjust: 100%;
    7. -webkit-text-size-adjust: 100%;
    8. vertical-align: baseline;
    9. background: transparent;

    }

    style.dev.c…er=5.7.2:28
    ol, ul {

    1. list-style: none;

    }

    style.dev.c…er=5.7.2:14
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {

    1. margin: 0;
    2. padding: 0;
    3. border: 0;
    4. outline: 0;
    5. font-size: 100%;
    6. -ms-text-size-adjust: 100%;
    7. -webkit-text-size-adjust: 100%;
    8. vertical-align: baseline;
    9. background: transparent;

    }

    style.dev.c…=4.9.0:8269
    * {

    1. -webkit-box-sizing: border-box;
    2. box-sizing: border-box;

    }

    style.dev.c…=5.7.2:8269
    * {

    1. -webkit-box-sizing: border-box;
    2. box-sizing: border-box;

    }

    user agent stylesheet
    ul ul {

    1. list-style-type: circle;
    2. margin-block-start: 0px;
    3. margin-block-end: 0px;

    }

    user agent stylesheet
    ul {

    1. display: block;
    2. list-style-type: disc;
    3. margin-block-start: 1em;
    4. margin-block-end: 1em;
    5. margin-inline-start: 0px;
    6. margin-inline-end: 0px;
    7. padding-inline-start: 40px;

    }

    Inherited from

    li.et_pb_menu_page_id-222763.menu-item.menu-item-type-custom.menu-item-object-custom.current-menu-ancestor.current-menu-parent.menu-item-has-children.menu-item-222763

    style.dev.c…=4.9.0:9096
    .et-menu li {

    1. display: inline-block;
    2. font-size: 14px;
    3. padding-right: 22px;

    }

    style.dev.c…=4.9.0:8325
    .nav li {

    1. position: relative;
    2. line-height: 1em;

    }

    style.dev.c…=5.7.2:9095
    .et-menu li {

    1. display: inline-block;
    2. font-size: 14px;
    3. padding-right: 22px;

    }

    style.dev.c…=5.7.2:8325
    .nav li {

    1. position: relative;
    2. line-height: 1em;

    }

    user agent stylesheet
    li {

    1. text-align: -webkit-match-parent;

    }

    Inherited from

    ul#menu-hauptmenue.et-menu.nav

    style.dev.c…4.9.0:11667
    .et_pb_menu .et-menu-nav > ul, .et_pb_fullwidth_menu .et-menu-nav > ul, .et_pb_menu .et-menu-nav > ul, .et_pb_fullwidth_menu .et-menu-nav > ul {

    1. padding: 0 !important;
    2. line-height: 1.7em;

    }

    style.dev.c…5.7.2:11666
    .et_pb_menu .et-menu-nav > ul, .et_pb_fullwidth_menu .et-menu-nav > ul, .et_pb_menu .et-menu-nav > ul, .et_pb_fullwidth_menu .et-menu-nav > ul {

    1. padding: 0 !important;
    2. line-height: 1.7em;

    }

    user agent stylesheet
    ul {

    1. list-style-type: disc;

    }

    Inherited from

    div.et_pb_module.et_pb_menu.et_pb_menu_0_tb_header.et_pb_bg_layout_light.et_pb_text_align_left.et_dropdown_animation_fade.et_pb_menu--without-logo.et_pb_menu--style-centered

    style.dev.c…4.9.0:13312
    .et_pb_text_align_left {

    1. text-align: left;

    }

    style.dev.c…5.7.2:13309
    .et_pb_text_align_left {

    1. text-align: left;

    }

    Inherited from

    body.page-template-default.page.page-id-222237.logged-in.admin-bar.custom-background.et-tb-has-template.et-tb-has-header.et-tb-has-footer.et_button_no_icon.et_button_custom_icon.et_pb_button_helper_class.et_cover_background.et_pb_gutter.osx.et_pb_gutters3.et_pb_pagebuilder_layout.et_smooth_scroll.et_no_sidebar.et_divi_theme.et-db.customize-support.chrome

    (index):182
    body, p {

    1. font-weight: 500;

    }

    et-core-uni…6.min.css:1
    body, input, textarea, select {

    1. font-family: 'Quicksand',Helvetica,Arial,Lucida,sans-serif;

    }

    et-core-uni…6.min.css:1
    body {

    1. color: #171718;

    }

    et-core-uni…6.min.css:1
    body, .et_pb_column_1_2 .et_quote_content blockquote cite, .et_pb_column_1_2 .et_link_content a.et_link_main_url, .et_pb_column_1_3 .et_quote_content blockquote cite, .et_pb_column_3_8 .et_quote_content blockquote cite, .et_pb_column_1_4 .et_quote_content blockquote cite, .et_pb_blog_grid .et_quote_content blockquote cite, .et_pb_column_1_3 .et_link_content a.et_link_main_url, .et_pb_column_3_8 .et_link_content a.et_link_main_url, .et_pb_column_1_4 .et_link_content a.et_link_main_url, .et_pb_blog_grid .et_link_content a.et_link_main_url, body .et_pb_bg_layout_light .et_pb_post p, body .et_pb_bg_layout_dark .et_pb_post p {

    1. font-size: 16px;

    }

    style.dev.c…er=4.9.0:68
    body {

    1. font-family: 'Open Sans', Arial, sans-serif;
    2. font-size: 14px;
    3. color: #666;
    4. background-color: #fff;
    5. line-height: 1.7em;
    6. font-weight: 500;
    7. -webkit-font-smoothing: antialiased;
    8. -moz-osx-font-smoothing: grayscale;

    }

    style.dev.c…er=4.9.0:25
    body {

    1. line-height: 1;

    }

    style.dev.c…er=5.7.2:68
    body {

    1. font-family: 'Open Sans', Arial, sans-serif;
    2. font-size: 14px;
    3. color: #666;
    4. background-color: #fff;
    5. line-height: 1.7em;
    6. font-weight: 500;
    7. -webkit-font-smoothing: antialiased;
    8. -moz-osx-font-smoothing: grayscale;

    }

    style.dev.c…er=5.7.2:25
    body {

    1. line-height: 1;

    }

    Pseudo ::selection element

    (index):358
    body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs, body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li, body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li.active, body.woocommerce div.product .woocommerce-tabs ul.tabs li, body.woocommerce div.product .woocommerce-tabs ul.tabs li.active, #page-container .oliviapro_light_background, #page-container #oliviapro_light_background, .oliviapro_grid .et_pb_post, .oliviapro_grid .et_pb_post .entry-featured-image-url:after, .et_pb_module.et_pb_widget_area .widget_categories a, .et_pb_widget.widget_text:nth-of-type(2n), .oliviapro_blurbwork .et_pb_blurb .et_pb_blurb_container .et_pb_module_header, .et_pb_posts a.more-link:hover, .oliviapro_grid a.more-link:hover, .oliviapro_grid_blog a.more-link:hover, ::selection, #sidebar .widget_categories a, .et_pb_module.et_pb_widget_area .widget_categories a, .oliviapro_portfolio .et_pb_portfolio_filters li a {

    1. background-color: #f5f5f5 !important;

    }

    style.css?v…21449856:99
    ::selection {

    1. background-color: #f5f5f5;

    }

  • Estelle mal ein Beispiel bei Codepen.

    Um richtig zu helfen, brauchen wir auch den HTML Teil.

    So kann man nicht richtig helfen , weil der CSS Code so auch nicht brauchbar ist mit den ganzen Zahlen davor.

    Kopiere dein CSS und HTML Code bei codepen.io rein und poste uns dann den Link.

    Falls dein Menü auch Javascript nutzt, dann kopiere den da auch rein.

  • Oder bin ich hier an einen 16-jährigen Dödel geraten?

    Nein, bist du nicht.

    Ich selber habe auch häufiger mit WordPress zu tun, aber jedes mal musste ich auch CSS-Anpassungen durchführen. Ohne geht es auch bei WordPress nicht.

    Außerdem frag ich mich wozu es dieses Forum gibt, wenn nicht um Fragen zu stellen.

    Ich halte es eben für ganz schön dreist, wenn man für seinen Job kostenlose Hilfe in Anspruch nimmt, um dann damit Geld zu verdienen. Wenn ich etwas nicht kann, nehme ich einen Job nicht an, man kann nicht alles wissen. Dann verzichte ich lieber auf einen Auftrag, bevor ich auf kostenlose Hilfe baue. Ist zumindest meine Einstellung.


    Und nochmal: ohne sich das ansehen zu können, wird man dir nicht helfen können.


    basti1012

    Wenn man WordPress einsetzt, dann wird das mit Codepen schwierig.

  • Das ist eine ganz schön traurige Lebenseinstellung gleich zu allem nein zu sagen, nur weil man einen Teil von etwas noch nicht beherrscht. Ich hätte dank einer Hilfestellung lernen können, aber du erinnerst mich an die Lehrer in der Schule die sagen "Aus dir wird eh nichts".

    Ich gehe damit in ein anderes Forum und hoffe sehr, du bist im echten Leben entspannter.

  • Haaaallloooo, ich würde dir ja helfen aber

    ohne sich das ansehen zu können, wird man dir nicht helfen können.


    Das ist eine ganz schön traurige Lebenseinstellung gleich zu allem nein zu sagen,

    Das tue ich ja nicht, allerdings schätze ich ab, ob es Sinn macht, einen Auftrag anzunehmen. Und wenn ich einen Teil nicht beherrsche, dann frage ich andere Fachleute, die dann aber auch entsprechend dafür bezahlt werden.

    hoffe sehr, du bist im echten Leben entspannter

    Ich bin sowas von entspannt ;)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!