I think I accidently clicked on something but now I can't figure out how to change it back to the normal font in Markdown cell mode as you can see here.
I have clicked every buttons possible but still not work
Related
As I am trying to figure out the 'CSS Grid', I stumbled over Firefox Developement Edition. By the way, a great tool for learning CSS Grid. It would be even nicer if I could use the editor to actually change stuff. Unfortunately, I do not know how to save the changes I made (img).
help is much appreciated.
Your screenshot shows the Inspector-View of the dev tools. You can save files to you local disc with in the Style-Editor-View. There is a little save-button for each style-file.
However you also can mark style properties with the mouse and copy and paste them anywhere.
In modern Firefox, there is a new feature for this!
In the inspector, in the right pane, the fourth tab should be Changes.
It contains a button to Copy All Changes you made to the clipboard as a stylesheet.
You can then use the extension Stylish, create a new style in there, paste those styles into the text box, add a URL patten for which it should apply via the buttons below, give it a name, save the thing, and you’re set.
One caveat: If you disabled CSS rules on that page, they will appear as comments and do nothing. So you need to uncomment them, and set their value to something like none or initial or unset.
E.g. to force those brain-dead sites that are designed for tablets only to use the full width of your screen, you’d disable max-width, which would appear as /* max-width: 80rem; */ or something in your styles. So you’d turn that into max-width: none;.
I have a website where all links are working normally in the major browsers except Safari. In Safari, if the user clicks on a link with target="_blank" and then goes back to the original tab, the link is no longer styled as a link. If you then close the newly opened tab, the link immediately updates to being styled.
That is:
In my site at https://mysite.umich.edu/myapp I have a link in this format:
Accept Role in our Glossary of Terms
On the page, it looks like this:
When I click on that link, the linked-to URL (the glossary) opens up in a new tab, and I am taken to that tab. If I then go back to the tab where I started (https://mysite.umich.edu/myapp), the link is no longer styled as a link:
If then, staying on the original page, I close the newly opened tab (the one showing the glossary), the link will immediately go back to looking like the first screenshot above.
Debugging this is made more complicated by the fact that the problem doesn't happen if Developer Tools are open. Also, some sequence of clicks will make the problem go away, but I have not yet been able to reproduce that effect.
It seems like this must be some sort of timing issue in Safari. Does anyone have any clues about how to fix it?
There does seem to be some sort of timing issue with Safari whereby it holds on to the CSS for A:HOVER in the original tab even after the user has moved the cursor away from the link, but this would not have been a problem if we had had a reasonable CSS rule for A:HOVER. Since our A:HOVER CSS rule set the text color to the same color as our default text, we could not, of course, distinguish the link from the surrounding text. Changing the CSS made this a non-issue.
So it seems like Safari is misbehaving, but in our situation, at least, there is a workaround.
Here is the web site: plantcatching.com
Set "Montreal" in the search textbox and hit Enter. The map should go there and show results (after you zoom in one notch I think). A panel will slide from the left for the list of results. This panel has a white arrow attached so that it's possible to collapse/expand it. Here is what happens:
On IE/Firefox: the panel slides well.
On Chrome: the first time the panel extends, it works well. Then any
new manipulation shows the issue. The content of the panel and the
tabs will change position only after the jquery.animate("left") is
finished.
I let you have a look at the css structure under firebug or other dev bar, but basically it seems that chrome doesn't like the various "position:relative" css rules inside the panel. The problem is that I don't control them. They are set by the mCustomScrollbar jquery plugin. To check that this is the actual reason, just zoom out a little until a small window appears notifying that you should zoom in again. This empties the content of the pane and collapses it. See how it closes nicely this time, since there is no content anymore in the pane.
The question is: how should I modify the css (the part I control) so that it works well in Chrome and continues to work well in other browsers?
Let me know if something is unclear, I will update this question.Thanks for your help.
There was no answer here, so I decided to fix it myself by adopting css3 transitions on chrome only. This is now far better but you will notice that the tabs are a bit lagging when the panel slides. This does not happen in non webkit browsers.
In Internet Explorer, there is unnecessary padding that occurs to the left and right within the button when the button name is large. As a result of this, the known solution is to add "width: auto" and "overflow:visible" to the button style, but doing so will inadvertently make the text in the button disappear when the user scrolls the page down and then back up.
I would very much like to use the style I've included so the padding stays removed, but more importantly resolve the issue with the button text disappearing. It's really an odd one!
I've created this DEMO page for you to test the code where it's happening: http://jsbin.com/uhuze3
Note: You'll need IE7 to see the issue, so for those who don't have it, I create this video for you to see the issue. http://screencast.com/t/MTg0NzY2Zj
I was able to resolve this and improve the code a bit.
You can see the code here:
http://jsbin.com/uhuze3/4
This was the old code:
http://jsbin.com/uhuze3
Edit by Johnny5 :
It seem to be the combinaison of "height" and "line-height" that correct the bug.
I am using #font-face on a site I am working on, and all is working perfectly cross-browser until I use a modal window to display an iframe.
When a link is clicked within the iframe or a form is submitted, Internet Explorer 8 loses the #font-face styling and reverts to Arial. This problem also occurs if a modal window is opened with an iframe, then closed again, and then the user highlights text. As soon as the text is highlighted, it loses its font styling.
Has anyone else had this problem before or found a way around this?
I've found this issue too. I've done some work on trying to reproduce, and found it's extremely variable. Sometimes it will happen, sometimes not.
See my full post here:
http://kenneth.kufluk.com/blog/2010/02/losing-face-with-ie8/
Things to try:
Check your doctypes match
Remove all fallback fonts (bit harsh, but seemed to work)
Use javascript to reload the stylesheet after the window closes