whats the default padding for a jquery button? tried to download and search the dev pack... :( did not fint it :(
From the stylesheet:
.ui-button-text-only .ui-button-text {
padding: .4em 1em;
}
As one of the commenters mentioned, it's very easy to find this out by using the firefox plugin firebug, or by using the web inspector in Safari/Chrome
Related
I'm trying to add the Normalize.css from node_modules but it doesn't work.
I have tried everything, from a custom configuration for webpack (I'm using version 5 for my React project), to importing it into the preview.js and preview-head.html, but I can't get it to work, Storybook still keeps putting me the browser styles and it's very frustrating, because in my React project I want to use a css normalizer.
Can someone give me an example of how it would be done? Since what I have found in the documentation and on the internet has not helped me or I have not known how to do it.
Thanks
You can try put the style tag in preview-head.html
Like this:
<style>
/* copy-paste normalize code hire */
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}
...
</style>
The storybook docs mention importing your css in preview.js
https://storybook.js.org/docs/react/configure/styling-and-css#importing-css-files
To use your CSS in all stories, you import it in .storybook/preview.js
// ./storybook/preview.js
import 'normalize.css';
Newbie question: I've created a github page for one of my projects
http://grokimagecompression.github.io/grok/#/
by copying a tutorial from the web, and modifying it .
The source can be found here:
https://github.com/GrokImageCompression/grok/tree/gh-pages
I would like to set a background image, similar to how this page does it:
http://blackrockdigital.github.io/startbootstrap-creative/
but so far have had no luck. The image is img/header.jpg in my gh-pages branch.
Any guidance would be greatly appreciated!
I would add to the css
body {
padding-top: 50px;
padding-bottom: 20px;
background: url("img/header.jpg") no-repeat center cover;
}
For more information about background check the MDN
Browser: My application renders as IE7 Mode(Document Mode)
I have a similar requirement as Deka87 had for Use font awesome icon as css content. Now, when I implement the solution given by Mr. Alien I get a weired problem.
CSS Class:
.listing th.sort-col-d{
font-family: FontAwesome;
content: "\f0dd";
}
This when rendered in browser, makes the content=" ". Screenshot
When I check my network tab then the font awesome request is successful and I can see the Response Body. It even changes the font for the th element.
I am not sure what could be the issue?
Quoted from the font-awesome website: http://fortawesome.github.io/Font-Awesome/get-started/
If you need IE7 support, you have my condolences. Really. Font Awesome
4.4.0 doesn't support IE7, but an older version does. You'll need to check out the 3.2.1 instructions for using IE7. Then go complain to
whomever decided your project needs IE7 support.
I have a SPA project in VS 2013 using Angular.js and HotTowel and Breeze. It works fine on my development machine but when I deploy it to IIS 8.0 on a webserver running Windows Server 2012 it fails. The framework loads but it does not load my default view. It simply flashes the splash page and shows an empty browser.
I can walk through the js code using the Developer Tools but it never loads my default view into the index.html.
Using the developer tools in IE, I set breakpoints in the config.route.js to walk through the process of determining what page will be loaded into the SPA. It appears to be coming up with the correct page. The page that is supposed to load is called request.html so I also placed a breakpoint in the request.js to see if it was failing on the load. It never hits this breakpoint.
I am hoping that perhaps somebody has run into these same or similar issues when deploying an SPA to IIS.
Thanks for any help that can be given. In the meantime, I will keep searching.
JG
Success at last! As stated in the comments I found there were some path issues in the index.html. I managed to fix the problem by removing the leading '\' from the data-ng-include for the shell.html.
Was:
<div data-ng-include="'/app/layout/shell.html'"></div>
Now:
<div data-ng-include="'app/layout/shell.html'"></div>
This enabled the code to find the proper directory level for the shell.html. I was concerned that this would break the code for the dev environment but it works fine.
I then found that I needed to fix similar paths in the directives.js file in the function for the ccWidgetHeader. The templateUrl had to be modified.
Was:
/app/layout/widgetheader.html
Now:
app/layout/widgetheader.html
Finally I had to modify the style.css to fix a path for a logo image in the header.
Was:
.navbar .brand {
background: url(/content/images/fcma-biostar.png) no-repeat left center !important;
margin-left: -6px;
padding: 35px 50px;
}
Now:
.navbar .brand {
background: url(images/fcma-biostar.png) no-repeat left center !important;
margin-left: -6px;
padding: 35px 50px;
}
Many Thanks! to PW Kad and fops for chiming in on this issue!
well just a guess, of course a blank screen can be caused by way more reasons that the one mentioned here.
in my case i had to turn off the minification in the BundleConfig.cs code:
BundleTable.EnableOptimizations = false;
(consider this as a workaround. To fix it definitely its worth a try to check the dependency injection part of your angular code)
Using boxsizing.htc is not working for me. The answers to other posts here on Stack Overflow have not worked for me:
Zerb Foundation 3 - IE7 Fix not working?
Making Zurb's Foundation 3 work with IE7
Here's what I did:
Created the boxsizing file in TextEdit, put the code there, named it boxsizing.htc, saved as Unicode 8.
Uploaded to my javascripts directory, at my domain root.
Added this to my stylesheet:
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
*behavior: url(http://mydomain.com/javascripts/boxsizing.htc);
}
Added this to the htaccess file:
AddType text/x-component .htc
To be safe, I made sure that jquery and modernizr are linked before the stylesheet is, just in case the htc file needs jquery.
Still no results. Any ideas?
The site is http://bureauforgood.com/index.php
Thanks!
Have you tried using *behavior: url(/javascripts/boxsizing.htc);?
I had to fiddle with the path to get this working.