Wufoo form is not loading custom stylesheet - css

I have a wufoo form that I am trying to customize with css. My css form is being uploaded as far as I can tell, but so far I haven't been able to change anything. Any tips?
The only thing I've tried to do is change the header color like so:
.wufoo .info h2 {
color:blue;
}
Here are the necessary links:
Stylesheet - http://crimsonroot.com/files/php/custom.css
Form - https://thedrawshop.wufoo.com/forms/r60xxmf0kwbb7j/

The issue as far as I can tell is that you are trying to link to a stylesheet, that is not on an secure connection. Basically it's http but your form is secured https. Many browsers by default prevent the loading of "mixed content" you will need them to both be on the same connection style before it will even begin to load.
Hope that helps.
Also try this, tested and works.
http://thedrawshop.wufoo.com/forms/r60xxmf0kwbb7j/

I ran into the same problem and then I hosted it on Github but it seems that Wufoo is still not loaded it even if it was imported correctly when you check the source.
What I did was to host it instead on Dropbox. I used the sharing link and then added raw=1 at the end.
E.g. https://www.dropbox.com/s/x2fhvsk83fnebw3/wufoo.css?raw=1
That did the trick for me. I hope it helps.

Related

WordPress My Custom Class doesn't appear in inspection

I'm editing my CSS and I have new Custom class but it's not working and it is not showing in inspection either.
Normally when you have a class and this class is overriden, it shows in inspection so I don't believe this is a hierarchy problem
Style.css
.search-form .search-submit .mycustomclass{}
in my inspection i see
.search-form .search-submit{}
is loaded but that's it
maybe you are viewing cached version of your css, try removing your browser cached or try hard refresh by pressing CTRL + F5
hope it works for you.
Please check those steps to see if any of them may help you:
check if you are on the correct URL.
Clear your cache (especially if you use a CMS like Drupal).
On the Dev Tools (Google Chrome) go to Sources, find your CSS file
and check if your class is listed on that file.
Try to make any other changes to the CSS file to see if it will
take any changes at all. E.g. body { display: none; }

Css background Wont work?

I have a question.
I am currently building a "blog" website. Not that it matters but..
I am trying to set my background to be a specific image that i have.
And it used to work! Until recently and I just don't know why it wont.
It works when i am on my computer, everything works fine.
But i am using 000Webhost as the hoster for the website.
So if u go to "http://pontuslundhblogg.uphero.com/"
You might see that the website is completely white. Cause the picture wont load for the background.
In my css sheet, i am using:
body {
background-image: url("bakgrund.jpg");
And yes, i did name the picture bakgrund.jpg and uploaded it to 000webhost. Its the exact same name etc. I wondering.. Could two different css stylesheets make so it gets weird or something? Cause I added a second css style sheet to be able to have a drop-down menu in a different sheet, and i added the drop-menu. Around that time it started messing with me..
Is it me doing something wrong.
Or is it 000Webhost?
(Might add that none of my pictures is working now, i can also contribute with more code if needed!)
If you go to pontuslundhblogg.uphero.com/bakgrund.jpg you get a message
"The image pontuslundhblogg.uphero.com/bakgrund.jpg cannot be
displayed because it contains errors".
If you go to pontuslundhblogg.uphero.com/bakgrund1.jpg you get 404 page, which means that the first path (bakgrund.jpg) is correct - but the image itself isn't good.
Try to upload it again or contact the hosting service.
If you use FTP maybe you need to change something in your FTP program settings - maybe change from ASCII to Binary transfer.
http://www.inmotionhosting.com/support/website/file-management/corrupt-file-ftp-transfer

How might I select cross-domain links in my user stylesheet?

Using a user stylesheet, I want to put a special icon before any link that takes me to a different domain from any website(e.g. example.com to example1.example.com, example.com to stackoverflow.com, example.com to example.com:80,*http://example.com* to https://example.com etc. but not example.com/patha to example.com/pathb). How would I do this? I already know that to put the image before a link, I must use something like
a:before
{
content:url(path/to/icon.png);
}
I have tried it and made sure it works, but how would I make it select only cross-domain links? My limitations are to that of the user style sheet in Chrome, meaning no scripts unless I can specify a user-written script without turning it into an extension.
I've tried a[href^=http]:before but a) not every website puts protocol in front of urls and b) websites can link to themselves with the protocols.
Thanks!
I've found the perfect solution to your problem.
Sadly, it's in CSS4, and we're still waiting for all of CSS3.
Here's the code anyway, as found in w3 specs;
a:not(:local-link(0)):before {
content:url(path/to/icon.png);
}

Css not working on published sites

I have just recently implemented the five star rating system from ajax, into my asp.net site. Everything works fine in locall debug mode.However. Once i publish it, the css does not show up. I have declared all of the css within the content page, not sure if this is why. I am very in-experienced with working with css; so i am sorry if it something simple.
I have checked the spelling of the image url, and have also tried implementing it into the site.css. But as i said, i am in-experienced; so am not sure what to do here.
This is my code as it stands:
The css declared at the top of the content page:
http://codepad.org/m1w39Hep
The reference to the css from my rating control:
http://codepad.org/Kl0BKets
Thanks in advance!
Check if your css links is right and your css files loaded successfully
I have seen your code.
Give extention as ".css" and not ".c"
I dont think that you can use Codepad for that because it does not give support for CSS.
If you are not using Codepad
Then as you are deploying it in server then check the URLs of the Images that are present in the CSS file for rating/.

Counter measure if/when external CSS file is not loaded when the page did

Due to network or some other reasons, some sites do not have their css files loaded and you will see unformatted/un-layout-ed ugly page.
It happened to pages I did before also. Kind of beyond control from a developer/design point of view.
I'm thinking of something like this place at the top of the page and obvious:
/*.... header and stuff */
<body>
<h2 id="hiddennote">If you do not see this page properly, please refresh</h2>
/*.... rest of the page .... */
The external stylesheet have a definition like this:
/* other styles defined */
#hiddennote {display: none;}
Functionally I know it'll work. Any drawbacks?
Another potential drawback is that it depends on the user knowing what the page is supposed to look like. You could fix that by changing the language of the message to something like, "This page is not displaying properly! While you are free to use the content below, you may want to refresh your browser to try loading the layout and styling information." You could also include a screenshot, assuming your images are not hosted on the same troublesome network.
The obvious drawback is if the page fails to load the CSS the second time.

Resources