Auf Thema antworten 2026

Beitrag

<blockquote data-quote="patrick_l" data-source="post: 2565033" data-attributes="member: 194379">So, ich erlaube mir mal einen Doppelpost. <img src="/styles/default/xenforo/smilies/zwinker.gif"&nbsp; class="smilie" loading="lazy" alt=";)" title="Wink&nbsp; &nbsp; ;)" data-shortname=";)" />Ich habe dir [USER=288646]@lachender_engel[/USER] zur Veranschaulichung auch die Flex-Variante auf Codepen hinterlegt. Es gibt noch weitere Möglichkeit und leicht abgewandelte Varianten, es jedoch bei den beiden belasse. Wenn du Fragen hast, raus damit. <img src="/styles/default/xenforo/smilies/zwinker.gif"&nbsp; class="smilie" loading="lazy" alt=";)" title="Wink&nbsp; &nbsp; ;)" data-shortname=";)" />[SPOILER=&quot;Markup&quot;][html]&lt;!-- Pagination v.2: Flexbox--&gt;&lt;menu class=&quot;pagination&quot;&gt;&nbsp; &lt;div class=&quot;pagination-inner-2&quot;&gt;&nbsp; &nbsp; &nbsp; &lt;a href=&quot;#&quot; class=&quot;back&quot;&gt;back&lt;/a&gt;&nbsp; &nbsp; &nbsp; &lt;a href=&quot;#&quot; class=&quot;next&quot;&gt;next&lt;/a&gt;&nbsp; &lt;/div&gt;&lt;/menu&gt;[/html][/SPOILER]Pagination v.2: Flexbox[code=CSS]/* Pagination wrap */menu.pagination {&nbsp; width: 100%;&nbsp; height: 40px;&nbsp; line-height: 40px;&nbsp; border-top: 2px dotted grey;&nbsp; border-bottom: 2px dotted grey;}/* Pagination v.2 Flexbox */menu .pagination-inner-2 {&nbsp; max-width: 960px;&nbsp; display: -webkit-box;&nbsp; display: -webkit-flex;&nbsp; display: -ms-flexbox;&nbsp; display: flex;&nbsp; -webkit-box-pack: justify;&nbsp; -webkit-justify-content: space-between;&nbsp; &nbsp; &nbsp; -ms-flex-pack: justify;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; justify-content: space-between;&nbsp; margin: 0 auto;}menu .pagination-inner-2 a {&nbsp; color: grey;&nbsp; text-decoration: none;&nbsp; font-weight: bold;&nbsp; -webkit-transition: color 300ms ease-in-out;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; transition: color 300ms ease-in-out;}menu .pagination-inner-2 a:hover {&nbsp; color: red;}menu .pagination-inner-2 .back::before {&nbsp; content: &quot;◀&quot;;&nbsp; margin-right: 7px;}menu .pagination-inner-2 .next::after {&nbsp; content: &quot;▶&quot;;&nbsp; margin-left: 7px;}menu .pagination-inner-2 .back::before,menu .pagination-inner-2 .next::after {&nbsp; color: white;&nbsp; background-color: grey;&nbsp; border-radius: 3px;&nbsp; padding: 6px 8px;}[/code]- Liebe Grüße, Patrick</blockquote>

[QUOTE="patrick_l, post: 2565033, member: 194379"] So, ich erlaube mir mal einen Doppelpost. ;) Ich habe dir [USER=288646]@lachender_engel[/USER] zur Veranschaulichung auch die Flex-Variante auf Codepen hinterlegt. Es gibt noch weitere Möglichkeit und leicht abgewandelte Varianten, es jedoch bei den beiden belasse. Wenn du Fragen hast, raus damit. ;) [SPOILER="Markup"] [html] <menu class="pagination"> <div class="pagination-inner-2"> <a href="#" class="back">back</a> <a href="#" class="next">next</a> </div> </menu> [/html] [/SPOILER] [B]Pagination v.2: Flexbox[/B] [code=CSS] /* Pagination wrap */ menu.pagination { width: 100%; height: 40px; line-height: 40px; border-top: 2px dotted grey; border-bottom: 2px dotted grey; } /* Pagination v.2 Flexbox */ menu .pagination-inner-2 { max-width: 960px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin: 0 auto; } menu .pagination-inner-2 a { color: grey; text-decoration: none; font-weight: bold; -webkit-transition: color 300ms ease-in-out; transition: color 300ms ease-in-out; } menu .pagination-inner-2 a:hover { color: red; } menu .pagination-inner-2 .back::before { content: "◀"; margin-right: 7px; } menu .pagination-inner-2 .next::after { content: "▶"; margin-left: 7px; } menu .pagination-inner-2 .back::before, menu .pagination-inner-2 .next::after { color: white; background-color: grey; border-radius: 3px; padding: 6px 8px; }[/code] - Liebe Grüße, Patrick [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?