Amongst other wiki-pages Arduino#Official_boards - Wikipedia the <gallery mode="packed">thumb for Adruino_Nano.jpg has a caption that is so narrow that it breaks on the word "Nan<br />o".
I know I could rotate the image but, I'm asking if there is a way to force a minimum width of a thumbnail possibly via some css-style padding if yes then the MediaWiki gallery page needs to mention what are the acceptable styles and, if not then. Where should I request any new gallery parameters or should I file a bug report on phabricator? or ¯\_(ツ)_/¯
In CSS you have the property min-width.
https://www.w3.org/TR/CSS2/visudet.html#min-max-widths
Related
I am making a template to a website, and have a final problem that I can't solve.
Two of the pages ("Bliv medlem" and "Kontakt DJK") seems to have a max width to the (main)content module. The only thing I've coded is the UI-kit "uk-width-1-1#s uk-width-4-5#m" classes. I have looked at all the classes and attributes I could see affected the modules, but I haven't been able to find anything.
On the page "Bliv medlem" the div tag containing the "content" module seems to have a max size of 1203.980 px. On the page "Kontakt DJK" the same module seems to have a max size of 891.656 px.
The website I'm making a template for is http://djk.limfjordsbanen.dk/index.php?option=com_content&view=category&layout=blog&id=8&Itemid=103&lang=da (at the moment only in Danish).
I am using the 3.9.16 version of Joomla and UIkit version 3.0.0-rc.2.
I believe the reason is because of the actual content you have on some of the pages.
If you have full-width paragraph text on http://djk.limfjordsbanen.dk/index.php?option=com_content&view=article&id=20&Itemid=128&lang=da you'll see that the 'content' module is wider (please see attachment 1)
Or alternatively, if you CSS hide the unordered list on http://djk.limfjordsbanen.dk/index.php?option=com_content&view=article&id=4&Itemid=112&lang=da the width of the 'content' module decreases. (please see attachment #2)
Good luck, I hope this helps!
I am working on my first website and I encountered a problem with the responsiveness of the fields in my search form. I use Wordpress theme and plug-ins and I am overriding their styles with my own.
The field groups for "Price"and "Build-Up Area" don't behave as expected when I change the size of the browser window. I created media queries for every browser size which breaks the structure, but it seems that I need about 10 separate queries, even more, which I consider as inappropriate.
(e.g. I have a query for max-width 780px and then it appears that I have to create another one for max-width 767px, because for that browser size the structure is broken again) .
I have red the original CSS code of the theme/plug-in, but I can't understand where the problem comes from.
What am I doing wrong?
Thank you in advance!
my website
Dont write css as per window size. Set the width in % for all screensize. For mobile, show the input field as one by one width as 100%.
mod_pagespeed does this nifty image-resizing, but only if "width= and height= attributes on the tag or an inline style= attribute" are set. This gets a bit problematic if you have e.g. an image blog with hundreds of posts and one day in the future might want to change the stylesheet, resulting in a new width for images.
So, is there a way to get both mod_pagespeed image-resizing and be able to specify the image width in a stylesheet? The insert_image_dimensions flag to mod_pagespeed isn't really helpful, since I can't specify image height, resulting in oddly stretched images.
The blog is running Wordpress, so perhaps there's some Wordpress-specific solution.
No, there is no support for cascading CSS styles into the page in mod_pagespeed. This is a really tricky rewriter to implement, since by definition it would require implementing a full cascade model + block the output of HTML on CSS processing. That's not to say it's impossible...
I have seen the option of loading different css files[called responsive web designing] for different screen sizes. But I want to know if there is some other way through which I can keep the CSS uniform.
I have to adjust the width of a title bar that should be of the same size as browser window with some margin-right
<toolbar width="some px value" margin-right="some px value">
I need some spacing at the end of the browser screen
Can I somehow get the current width of the browser screen and thus adjust my titlebar accordingly
"toolbar" defaults to being displayed as "inline". Try using "block". See this fiddle.
But I don't think "toolbar" is a valid html tag-name (I might be wrong). In any case old versions of Internet Explorer have a hard time figuring out what to do with certain tags (like most new semantic html5 tags) and won't apply any css to them.
If you feel the need to use new semantic tags and still need legacy browser support I recomend using Modernizr. Including it at the top of your page will use a small browser hack to get support for these tags even in old browsers.
I am writing this with no experience of using LESS. However I just wanted to know that if I have a LESS stylesheet for a page and a client viewing the page say changes the size of the page, can I have custom rules which sets the pixel value of an element if the page is resized to say less than 50% or can dynamically change the font of a heading on page resize?
The answer to your question is: YES
:)