tag:forum.selfhtml.org,2005:/self Passermarken ausserhalb von overflow:hidden – SELFHTML-Forum 2022-03-08T14:07:14Z https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1796971?srt=yes#m1796971 Linuchs 2022-03-05T13:31:32Z 2022-03-05T13:31:32Z Passermarken ausserhalb von overflow:hidden <p>Moin,</p> <p>ich drucke Vistenkarten, 2 x 5 Stück als table auf A4. Hintergrund-Bilder könnten aus dem td herauslaufen, deshalb</p> <pre><code class="block language-css"><span class="token selector">td</span> <span class="token punctuation">{</span> <span class="token property">position</span><span class="token punctuation">:</span> relative<span class="token punctuation">;</span> <span class="token property">overflow</span><span class="token punctuation">:</span>hidden<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Zum Schneiden brauche ich Passermarken ausserhalb von td und table:</p> <pre><code class="block language-css"><span class="token selector">.passermarke</span> <span class="token punctuation">{</span> <span class="token property">position</span><span class="token punctuation">:</span> absolute<span class="token punctuation">;</span> <span class="token property">width</span><span class="token punctuation">:</span> 10mm<span class="token punctuation">;</span> <span class="token property">right</span><span class="token punctuation">:</span> -5mm<span class="token punctuation">;</span> <span class="token property">top</span><span class="token punctuation">:</span> -5mm<span class="token punctuation">;</span> //<span class="token property">z-Index</span><span class="token punctuation">:</span> -1<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>So sieht es aus, wie kann ich overflow:hidden austricksen?</p> <p><a href="/images/5c4cb944-9c88-11ec-b1a4-b42e9947ef30.png" rel="noopener noreferrer"><img src="/images/5c4cb944-9c88-11ec-b1a4-b42e9947ef30.png?size=medium" alt="" loading="lazy"></a></p> https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1796972?srt=yes#m1796972 klawischnigg 2022-03-05T13:44:42Z 2022-03-05T13:44:42Z Passermarken ausserhalb von overflow:hidden <p>Hi there,</p> <blockquote> <p>ich drucke Vistenkarten, 2 x 5 Stück als table auf A4. Hintergrund-Bilder könnten aus dem td herauslaufen, deshalb</p> <pre><code class="block language-css"><span class="token selector">td</span> <span class="token punctuation">{</span> <span class="token property">position</span><span class="token punctuation">:</span> relative<span class="token punctuation">;</span> <span class="token property">overflow</span><span class="token punctuation">:</span>hidden<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Abgesehen davon, daß ich mich davor fürchte zu erfahren, wozu Du dazu eine Tabelle benötigst,</p> <blockquote> <p>Zum Schneiden brauche ich Passermarken ausserhalb von td und table:</p> <pre><code class="block language-css"><span class="token selector">.passermarke</span> <span class="token punctuation">{</span> <span class="token property">position</span><span class="token punctuation">:</span> absolute<span class="token punctuation">;</span> <span class="token property">width</span><span class="token punctuation">:</span> 10mm<span class="token punctuation">;</span> <span class="token property">right</span><span class="token punctuation">:</span> -5mm<span class="token punctuation">;</span> <span class="token property">top</span><span class="token punctuation">:</span> -5mm<span class="token punctuation">;</span> //<span class="token property">z-Index</span><span class="token punctuation">:</span> -1<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>So sieht es aus, wie kann ich overflow:hidden austricksen?</p> </blockquote> <p>würde ich vorschlagen (wenn Du auf einer Tabellenzelle bestehst), daß Du Dein Bild nicht der Tabellenzelle einschreibst sondern einem Blockelement, daß über ein entsprechendes Padding (das dem Abstand Deiner Marken entspricht) der Tabellenzelle einschreibst. Das Hintergrundbild ist dann Hintergrund (wenn es denn unbedingt ein Hintergrundbild sein muß) des Blockelements, nicht der Tabellenzelle...</p> https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1796973?srt=yes#m1796973 Der Martin 2022-03-05T14:18:19Z 2022-03-05T14:18:19Z Passermarken ausserhalb von overflow:hidden <p>Hallo,</p> <blockquote> <p>ich drucke Vistenkarten, 2 x 5 Stück als table auf A4.</p> </blockquote> <p>ich zweifle daran, dass HTML (sprich: ein Webbrowser) hier das geeignete Mittel ist. Ich habe dafür bisher immer eine Office-Suite verwendet und mir darin eine zum Visitenkartenformat passende Vorlage gemacht.</p> <blockquote> <p>Zum Schneiden brauche ich Passermarken ausserhalb von td und table:</p> </blockquote> <p>Warum außerhalb?<br> Ganz pragmatischer Tipp: Mach deine Zellen etwas größer als das Visitenkartenformat und positioniere die Passermarken dann <em>innerhalb</em> der Zellen, so dass sie die richtige, gewünschte Zuschnittgröße markieren.</p> <p>Möge die Übung gelingen<br>  Martin</p> <div class="signature">-- <br> Darmstadt? Ist das nicht da, wo immer der Urologen-Kongress tagt? </div> https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1796975?srt=yes#m1796975 Rolf B 2022-03-05T15:07:18Z 2022-03-05T15:11:09Z Passermarken ausserhalb von overflow:hidden <p>Hallo Linuchs,</p> <blockquote> <p>//z-Index: -1;</p> </blockquote> <p>Hinweis am Rande, hoffentlich nicht von hidden versteckt: CSS Kommentare mit // gips nich, das ist immer /* ... */</p> <p>Eine Table kann man nehmen, aber ein Grid geht genauso. Und wenn Du die eigentliche Visitenkarte vom strukturellen Element trennst, ist das overflow:hidden kein Problem. Sprich: Hau die Visitenkarte nicht direkt ins td (oder li), sondern leg noch ein Extraelement drumherum. Ich hab article genommen, aber da diese Seite nur als Papiervorlage gedacht ist, ist Semantik und Zugänglichkeit nachrangig.</p> <p>Look Ma, all CSS: <a href="https://jsfiddle.net/Rolf_b/16tgsfrj/" rel="noopener noreferrer">klick</a></p> <p>Nur so als Grundplan. Wenn Du andere Passer brauchst, gibt den ::before/::after Hintergrundbilder oder setze die Ränder anders.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1797121?srt=yes#m1797121 Linuchs 2022-03-08T14:07:14Z 2022-03-08T14:07:14Z Lösung <p>Habe einen div mit overflow:hidden ins td gepackt und die Passermarken ans td geklebt.</p> <p>Danke fürs Mitdenken.</p> https://forum.selfhtml.org/self/2022/mar/05/passermarken-ausserhalb-von-overflow-hidden/1796978?srt=yes#m1796978 Der Martin 2022-03-05T17:41:52Z 2022-03-05T18:45:51Z Kommentare in CSS <p>Hallo Rolf,</p> <blockquote> <blockquote> <p>//z-Index: -1;</p> </blockquote> <p>Hinweis am Rande, hoffentlich nicht von hidden versteckt: CSS Kommentare mit // gips nich, das ist immer /* ... */</p> </blockquote> <p>korrekt, aber in der Praxis zumindest hier irrelevant: Die führenden zwei Slashes führen dazu, dass der CSS-Parser hier eine Eigenschaft <strong>//z-Index</strong> erkennt. Die kennt er aber nicht, also wird die ganze Regel ignoriert. <em>qee</em> (quod erat expectandum).</p> <p>Anders sieht's aus, wenn man an eine bis dahin korrekte CSS-Regel mit <strong>//</strong> noch einen vermeintlichen Kommentar anhängen will. Dann versucht der CSS Parser, das Token <strong>//</strong> und alles, was danach kommt, als Teil des Wertes für die CSS-Eigenschaft zu interpretieren. Das geht dann schief, und folglich wird auch hier die Regel ignoriert. Und der Autor wundert sich.</p> <p>EDIT: Nein, falsch. Es ist noch schlimmer: Folgt das vermeintliche Kommentartoken <strong>//</strong> <em>nach</em> dem Semikolon, das eine CSS-Regel faktisch abschließt, dann torpediert es <em>die nachfolgende</em> CSS-Regel, selbst wenn die in der nächsten Zeile steht. Da wundert man sich dann erst recht!</p> <p>Möge die Übung gelingen<br>  Martin</p> <div class="signature">-- <br> Darmstadt? Ist das nicht da, wo immer der Urologen-Kongress tagt? </div>