Messed up my site's CSS - css

Well, I did something pretty stupid. I'm using ruby on rails, and I was adding glyphicons to my site , but for some reason they weren't loading properly. A plus sign in my header looked small, and the edit and delete signs on another page came up as rectangles (The browser I was using was Chrome, and all of this was looked at via LocalHost:3000).
I decided to copy and paste the bootstrap_and_customization.css.scss file from a git-hub page into my own respective file, just to experiment.
I didn't see much of a difference, aside from spacing. After saving, I found that my website looked completely different. All the CSS and Bootstrap elements seem to be gone. I clicked undo, saved again, and found that my website still looks bizarre.
I'm using gems, which has been pretty easy so far, but right now I'm stumped. I even did git reset --hard, so I know all of my code is as it was before I screwed things up.
Could you please help me?

Do you have something that is compiling the *.SCSS files into *.CSS? If not then they won't do anything.

Related

Chrome downloads aspx instead of render, IE works

Whenever I try visiting an aspx file in Chrome, the browser will download the file. When I open it in IE, it will actually render that page. I'm not sure what changed with Chrome as this was working, then half way through the day decided to stop working.
I've tried following aspnet_regiis -i with no success. Other aspx pages render without issue. I've been poking around IIS trying to find something that might indicate an incorrect setting, but cannot find anything in particular.
I've done plenty of Googling without any helpful results.
I'm not sure what other information to provide at this time, so please let me know if I can provide any specific information to help.

Images appear like they are CMYK when uploaded to web. However, they are RGB

I have worked with images/Photoshop for a long time and have never had this problem. Basically, I tried uploading a few images to WordPress and they appear like this:
As you can see, the one highlighted in green turns out fine. However, the other two for some reason come out looking like they are in CMYK mode. The images are RGB and saved for web so I'm not sure what the problem might be. Can anyone help me make sense of this?
Here is the file for one of the images that come out wrong (which is strange because it comes out fine here, maybe it's a strictly WordPress issue?):
I think your comment about CMYK is a red herring. Looking at your screen shot, it appears you may have inadvertently selected the images in the window; your browser has highlighted them to show this, which gives them a slight blue overlay. Try simply reloading the page and opening that window again and see if the issue goes away.
Ive had strange things happen from images that appeared ok in windows photo viewer but when loaded into adobe fireworks the colours go wrong in a similar way.
Im assuming that the pictures display incorrectly on the 'front end' of Wordpress too, therefore i think its some weird .jpg format issue.
If you have just a few images maybe worth manually screen grab and edit screen grab if you have a viewer that works, then save out and try to re-upload to wordpress.
Or batch process the files into a different format, say bump and use a wordpress plugin like insanity that has the option to automatically convert to .jpg, to in effect clean or at least change the image format on upload.
I had the same issue- If you delete the image from wordpress, change the size of the image file to something closer to the size of the page width, that might work. It worked for me. I can't explain why that happens, but it does!

Google Maps Custom Icons will not load in any Browser

I used a tutorial to make some custom icons in Google Maps API for some local places. When I am in Dreamweaver and testing on my local server, the icons appear just fine. However, when I upload to my host and try to pull the page up on any browser (safari, chrome, canary, firefox), the images do not load. The placeholders for those images do show, though. I cannot understand what the issue is as I have reloaded and rechecked the code hundreds of times. Any help with this would be appreciated. As the code is very long, I have only included some snippets and the address where it is loaded.
To see the page, go to http://www.theriveroverlook.com/Local.html
I tried to load the code using the forum rules, but no matter what, it would not allow me to put the javascript in this post!
Please let me know if you can help me! This is the last piece of the puzzle I need to load this website! I am a newbie coder so I have made a lot of beginner mistakes!
Edited to add:
Thank you for your help. When I renamed the folder, it was fixed. For some reason, it did not like the folder name "icons". Perhaps this has something to do with Google's API
I get the following errors when I load your page:
Since those are the images you are using to create your custom icons they all fail to generate and won't appear on the map. Make sure you are hosting your images correctly and it should work fine.

TinyMCE adds <pre> tag when inserting from Word

I have several Drupal 6 sites which use the WYSIWYG module along with TinyMCE. For one of my sites, whenever I use the Paste From Word icon, it adds a < pre > tag with the class "mceItemHidden".
In addition, if the text is long enough, it does this strange thing where I click the "Insert" button in the Paste from Word window, the text appears in the main TinyMCE box, there is a brief pause, and then each paragraph is on a single line, which creates the horizontal scrollbar that is as long as the paragraph.
Has anyone experienced this, and do you have any idea why this is happening? I've tried changing my theme and various WYSIWIG settings and this is still happening.
Pasting from word is an odd thing. I couldn't say for sure but MS seems to tweak it now and then to make it especially difficult to translate (while making sure that it still renders well in IE)
Do you get the same issue in the tinyMCE offical demo, if not you could try upgrading your FCK editor.
Pasting from word to begin with is a pain in the.... It's still a fight for us even with FCKeditor. It was a fight when we used Tiny as well. All that nasty xml and tags were brutal on our CSS.
You might check your drupal filters and the way that tiny sanitizes stuff. I forget where all that is. We used tiny for a while, then switched to FCKeditor. We switched for the image upload support. Much better than tiny. Anywho...
Something must have been corrupt. I just completely removed TinyMCE from the libraries directory, and uninstalled the WYSIWYG module. I reinstalled everything, and things seem to be working (for now).

In-text hyperlinks shown by Internet Explorer without the following space. What can be the reason? YUI?

I've a problem which is most likely some ugly CSS mistake, but I just can't spot the solution (and a few changes I tried did not help).
Some of in-text hyperlinks (not all!) are shown by Internet Explorer without the following space.
here is the example
See the link WatchBot just below the Rationale title (and a few similar links deeper in the article). Firefox, Opera, Chrome, Konqueror - all display it properly: WatchBot can. IE (6.0 but IIRC also 7.0) displays it as **WatchBot***can*.
I am using Yui-reset and yui-base. Is it possible that those libraries cause the problem?
Do you have a script running on, and altering, the content in any way? I say this because the page loads normally initially, but looks as though it undergos some modification later in the loading lifecycle.
If you think reset or base are making this happen try removing them one at a time - I haven't had any experience of this error before however (I usually use the full whack: Reset, Grids, Base and Fonts).
What I did notice however is that the first WatchBot link of the page is simply this:
<p>Have you ever been curious how is
WatchBot
picking the games to observe and save? Here is the explanation.</p>
Where as the second link looks like this:
<span>Due to the FICS limitations </span>
WatchBot<span> can
I have no idea what that second span is doing there - might be something to check up on. (It validated fine however - so there's definitely an closing span somewhere).
I'd say a good place to start would be to but a space after the anchor but before the span, rather than right after the span start tag.
Current state of the things: as steve_c spotted first, and buti-oxa confirmed, it looks like the layout is being spoiled by javascript (and as Ross noted, some extra spans are injected). Thank you all, I missed it.
I am to make experiments and selectively disable those scripts (analytics and google ads) to check whether it helps (my current bet is that maybe I have some HTML error or naming conflict)
Did you try to disable pageTracker? It seems to be the only script on your page, and it looks fine to me in its static form.
EDIT: I wondered what span Ross was talking about - I did not see any. I viewed the source. I just learned that Firefox allows to see both source and generated source (Toos/Web Developer/View Source). Sure enough, generated source has additional span inserted.
Solution: my page was spoiled by the text-link-ads script (which, in fact I activated on English blog by mistake - this is script by adkontekst.wp.pl, Polish firm). After disabling it everything is OK.
Thanks for everybody who pointed me into the right direction.

Resources