
Hello, @wiki team: this mail includes a proposal for a major change for Template:Point_here to fix a display bug (hidden content). (Sorry for switching mailinglists again, but this is something I have to bring up on the -wiki mailinglist.) on Dienstag, 3. Mai 2011, Felix Miata wrote:
picture worth many words: http://fm.no-ip.com/SS/opensusedotorg-too-narrow.jpg
But, what about new people not fully knowledgeable about overcoming dumb web page design? Why do web page designers insist on arbitrary widths that can't hold their content, and don't allow overflow to be accessible?
I just checked this. <pre> already has overflow:auto (which means it gets scrollbars if needed). The problem is the <table style="width:98%;"> (icon + text right of it) which is wider than the <div> around. Additionally, the <div> around the table uses <div style="overflow:hidden; [...]"> Changing it to "overflow:auto;" adds a scrollbar - it looks quite ugly, but at least works ;-) Nevertheless, it isn't the best solution. The overflow:hidden comes from http://en.opensuse.org/Template:Point_here which us used on all portals. I played around a bit, and IMHO this is at least some strange behaviour: The <pre> can widen the <td> around it - even if the parent element has a width restriction set :-/ I'm not sure if this is valid behaviour or a browser bug - but then it would be a bug in (at least) Firefox and Konqueror. The good news: I can offer a fully working solution (with the scrollbar only at the <pre>), but it requires a full rewrite of Template:Point_here. On the positive side, we would get rid of the table layout ;-) Instead of the table, use the following code: <div style="overflow:hidden; margin:.2em;"><!-- do we really need overflow:hidden? --> <div style="margin-left:15px; width: 48px; float:left;"> <!-- begin icon column content --> <a href="/index.php?title=File:Icon-package.png&filetimestamp=20100615144104" class="image"><img height="48" width="48" alt="Icon- package.png" src="/images/thumb/3/39/Icon-package.png/48px-Icon-package.png"></a> <!-- end icon column content --> </div><div style="margin-left:70px; border-left:1px solid #babdb6; padding-left:.5em; padding-top:1px;"> <!-- padding-top:1px looks silly, but with 0px the border starts 10px below :-( --> <!-- begin text column content --> <p><b>How to try Tumbleweed?</b> </p><p><br> </p> <ul><li> Add Tumbleweed to your YaST or zypper installation repositories and enable autorefresh: </li></ul> <pre>zypper ar --refresh \ http://download.opensuse.org/repositories/openSUSE:/Tumbleweed/standard/ \ Tumbleweed </pre> <ul><li> Do a distro update from Tumbleweed as needed. The first time you will need to accept the GPG key: </li></ul> <pre>zypper dup --from Tumbleweed </pre> <!-- end text column content --> </div> <div style="clear:left"></div> <!-- just to be sure --> </div> I did not count pixels ;-) but it looks about the same as the table-based version - with the advantage that <pre> gets scrollbars if needed :-) @Wiki team: The Point_here template is used on every portal page, which also means changing it could break a lot of pages ;-) Therefore I'm asking first: - Are you ok with changing the Point_here template to the code listed above? - Are there any side effects or "special" portal pages I should be aware of? Regards, Christian Boltz -- XSLT ist eine Art awk auf Bäumen und hat alle Nachteile von awk. Wenn man vorher nur Shell konnte, ist es allerdings die Erleuchtung. [Kristian Köhntopp in suse-linux-faq] -- To unsubscribe, e-mail: opensuse-web+unsubscribe@opensuse.org For additional commands, e-mail: opensuse-web+help@opensuse.org