• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

motyw Wordpress - jak podzielić nagłówek

Object Storage Arubacloud
0 głosów
174 wizyt
pytanie zadane 16 września 2019 w HTML i CSS przez grodzkistudio Nowicjusz (160 p.)

Jak podzielić nagłówek, aby litera "w" i zapis "im." nie były na końcu wiersza? Chodzi o nagłówek podzielony na 3 części w odpowiednich miejscach.

 

    /* =Responsive Structure
    ----------------------------------------------- */

    /* Does the same thing as <meta name="viewport" content="width=device-width">,
     * but in the future W3C standard way. -ms- prefix is required for IE10+ to
     * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
     * the meta tag. See https://core.trac.wordpress.org/ticket/25888.
     */
    @-ms-viewport {
       width: device-width;
    }
    @viewport {
       width: device-width;
    }

    @media (max-width: 800px) {
       /* Simplify the basic layout */
       #main #content {
          margin: 0 7.6%;
          width: auto;
       }
       #nav-below {
          border-bottom: 1px solid #ddd;
          margin-bottom: 1.625em;
       }
       #main #secondary {
          float: none;
          margin: 0 7.6%;
          width: auto;
       }
       /* Simplify the showcase template */
       .page-template-showcase-php .featured-posts {
          min-height: 280px;
       }
       .featured-posts section.featured-post {
          height: auto;
       }
       .page-template-showcase-php section.recent-posts {
          float: none;
          margin: 0;
          width: 100%;
       }
       .page-template-showcase-php #main .widget-area {
          float: none;
          margin: 0;
          width: auto;
       }
       .page-template-showcase-php .other-recent-posts {
          border-bottom: 1px solid #ddd;
       }
       /* Simplify the showcase template when small feature */
       section.featured-post .attachment-small-feature,
       .one-column section.featured-post .attachment-small-feature {
          border: none;
          display: block;
          float: left;
          height: auto;
          margin: 0.625em auto 1.025em;
          max-width: 30%;
          position: static;
       }
       article.feature-image.small {
          float: right;
          margin: 0 0 1.625em;
          width: 64%;
       }
       .one-column article.feature-image.small .entry-summary {
          height: auto;
       }
       article.feature-image.small .entry-summary p a {
          left: 0;
          padding-left: 20px;
          padding-right: 20px;
          width: auto;
       }
       /* Remove the margin on singular articles */
       .singular .entry-header,
       .singular .entry-content,
       .singular footer.entry-meta,
       .singular #comments-title {
          width: 100%;
       }
       /* Simplify the pullquotes and pull styles */
       .singular blockquote.pull {
          margin: 0 0 1.625em;
       }
       .singular .pull.alignleft {
          margin: 0 1.625em 0 0;
       }
       .singular .pull.alignright {
          margin: 0 0 0 1.625em;
       }
       .singular .entry-meta .edit-link a {
          left: 0;
          position: absolute;
          top: 40px;
       }
       .singular #author-info {
          margin: 2.2em -8.8% 0;
          padding: 20px 8.8%;
       }
       /* Make sure we have room for our comment avatars */
       .commentlist {
          width: 100%;
       }
       .commentlist > li.comment,
       .commentlist .pingback {
          margin-left: 102px;
          width: auto;
       }
       /* And a full-width comment form */
       #respond {
          width: auto;
       }
       /* No need to float footer widgets at this size */
       #colophon #supplementary .widget-area {
          float: none;
          margin-right: 0;
          width: auto;
       }
       /* No need to float 404 widgets at this size */
       .error404 #main .widget {
          float: none;
          margin-right: 0;
          width: auto;
       }
    }
    @media (max-width: 650px) {
       /* @media (max-width: 650px) Reduce font-sizes for better readability on smaller devices */
       body, input, textarea {
          font-size: 13px;
       }
       #site-title a {
          font-size: 24px;
       }
       #site-description {
          font-size: 12px;
       }
       #access ul {
          font-size: 12px;
       }
       #branding .only-search + #access div {
          padding-right: 0;
       }
       article.intro .entry-content {
          font-size: 12px;
       }
       .entry-title {
          font-size: 21px;
       }
       .featured-post .entry-title {
          font-size: 14px;
       }
       .singular .entry-title {
          font-size: 28px;
       }
       .entry-meta {
          font-size: 12px;
       }
       blockquote {
          margin: 0;
       }
       blockquote.pull {
          font-size: 17px;
       }
       /* Reposition the site title and description slightly */
       #site-title {
          padding: 5.30625em 0 0;
       }
       #site-title,
       #site-description {
          margin-right: 0;
       }
       /* Make sure the logo and search form don't collide */
       #branding #searchform {
          top: 1.625em !important;
       }
       /* Floated content doesn't work well at this size */
       .alignleft,
       .alignright {
          display: block;
          float: none;
          margin-left: 0;
          margin-right: 0;
       }
       /* Make sure the post-post navigation doesn't collide with anything */
       #nav-single {
          display: block;
          position: static;
       }
       .singular .hentry {
          padding: 1.625em 0 0;
       }
       .singular.page .hentry {
          padding: 1.625em 0 0;
       }
       .singular .entry-header .entry-meta,
       .singular .entry-header .entry-format,
       .singular .entry-meta .edit-link a {
          position: static;
       }
       /* Talking avatars take up too much room at this size */
       .commentlist > li.comment,
       .commentlist > li.pingback {
          margin-left: 0 !important;
       }
       .commentlist .avatar {
          background: transparent;
          display: block;
          padding: 0;
          position: static;
       }
       .commentlist .children .avatar {
          background: none;
          left: 2.2em;
          padding: 0;
          position: absolute;
          top: 2.2em;
       }
       /* Use the available space in the smaller comment form */
       #respond input[type="text"] {
          width: 95%;
       }
       #respond .comment-form-author .required,
       #respond .comment-form-email .required {
          left: 95%;
       }
       #content .gallery-columns-3 .gallery-item {
          width: 31%;
          padding-right: 2%;
       }
       #content .gallery-columns-3 .gallery-item img {
          width: 100%;
          height: auto;
       }
    }
    @media (max-width: 450px) {
       #content .gallery-columns-2 .gallery-item {
          width: 45%;
          padding-right: 4%;
       }
       #content .gallery-columns-2 .gallery-item img {
          width: 100%;
          height: auto;
       }
    }
    @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
       
       body {
          padding: 0;
       }
       #page {
          margin-top: 0;
       }
       #branding {
          border-top: none;
       }
    }

 

3 odpowiedzi

0 głosów
odpowiedź 16 września 2019 przez Majonez.exe Gaduła (3,490 p.)
Podaj kod HTML bo z samego CSS ciężko odczytać
0 głosów
odpowiedź 17 września 2019 przez lapa19904 Stary wyjadacz (11,560 p.)
Nagłówek który chcesz podzielić jest wpisywany w wp-admin czy w kodzie?

Daj link do strony.
0 głosów
odpowiedź 17 września 2019 przez grodzkistudio Nowicjusz (160 p.)
www.splesniowice.pl Chodzi o główny nagłówek strony.

Podobne pytania

–3 głosów
2 odpowiedzi 2,838 wizyt
pytanie zadane 13 maja 2017 w C i C++ przez jegor377 Stary wyjadacz (13,230 p.)
0 głosów
1 odpowiedź 423 wizyt
pytanie zadane 17 stycznia 2021 w HTML i CSS przez urbix01 Gaduła (3,290 p.)
0 głosów
0 odpowiedzi 79 wizyt
pytanie zadane 27 listopada 2019 w HTML i CSS przez Kacperhehe Bywalec (2,930 p.)

92,661 zapytań

141,557 odpowiedzi

319,999 komentarzy

62,028 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...