In my summernote editor I have the problem that the font icon isn't working while I see it back in the html. I am wondering how to fix this issue?
Thanks!
I faced this problem a while ago and solved by:
The fonts used by summernote is not the bootstrap one. They have their own font directory. One can check the console (Ctrl+Shift+I) in web browser for any error. One may have to edit the summernote.css file if they are not located in the default folder for Summernote like adding "../" in front of all the font references at the top of the css file.For my application, I had put it under /static/css/font for the server to find it.
To check whether the server is able to find the directory, one can also check the network by right click -> Inspect element-> change to network tab:
Related
My css only works when I open it with live-server. I didn't realized it until I tried opening the file
of my projects. The JS functionality is there, but my project is just stale, just black and white. I'm using sass and live-sass compiler. And also using a map api leaftlet and open weather api. SO please help,
cannot seems to figure out why my css is not present when I open my project on file or in another browser.
I have seen through your file and I think your issue is your image hasn't been loaded.
You have an image of the starry sky, right? You can only see the black and white page with some icons after the search because your image hasn't been loaded.
As you access the page by opening the file, the image URL in your CSS file is the path relatives to the current CSS file, which means the URL should be ../image/night.jpg.
If you access the page through the live server, that URL is the path relative to your host.
Hope that I understand your problem correctly. I am still learning too :)
In my Google Chrome version 38.0.2125.104, stylesheet filename/linked css has been disappeared. I'm not sure if updated version removed this or there is somewhere to set this up again, but when i restored to default, still it does not appear.
To make it clear to you guys, This is an example of old version Style Panel which have the link to the related stylesheet (filename & line) next to the class name.
http://i.pictr.com/7g52x66rw8.png (i cant attach images here yet)
and below is the latest Style Panel. Each classes usually have link to the CSS stylesheet .
http://i.pictr.com/sks0tp1sem.png
Any idea on how to enable back the stylesheet link?
Thanks in advance.
when you open the inspect element on the top right side of the dev eloper tools panel you have a cog wheel (settings). click that and go to general setting s tab and check out the elements section and sources section and see if all the boxes that needs to be checked are checked.... in mine i have the source maps box checked and enabled
I'm having an issue with CKEditor regarding image properties. Spent many hours investigating this but ended up without solution.
I'm using Drupal 7 with the latest CKEditor AND IMCE.
When I click on the image icon on CKEditor tool bar, the image properties popup window came up but I was looking at the "advanced" tab is not showing up. No tab show up at all.
Is there any configuration that I have to apply in order to show up the tabs in the image properties?
you can try by reinstalling with ckeditor - 7.x-1.16 and imce - 7.x-1.9,
worked for me
I got this trouble when use cdn version of ckeditor instead of local.
To fix it download latest ckeditor from official site http://ckeditor.com/download. I have downloaded full version. Then copy files to /sites/all/modules/ckeditor/ckeditor. Before you copy here must be only 1 file with name COPY_HERE.txt. After copy folders adapters, lang... etc.
Then go to the global settings of the ckeditor admin/config/content/ckeditor/editg and set path to the local ckeditor library like this: %m/ckeditor. Save settings and check if advanced tabs exist now.
I have seem a lot of videos in which developers are changing CSS on the fly in chrome. I tried the same thing but chrome did not allow me to change the code. I can't write on the style sheet.
Is there any specific setting to do this? Kindly help.
EDIT: To edit the CSS, I right click on an element, select inspect element. It will open the console. I select the id of the element and go to style.css in Resources and try to change the CSS. It does not allow me to write there.
You are doing it wrong... the resources panel is not there for live edit, if you want to change the css associated with an HTML element, right click on that element and then in the right panel you will see the css styles associated with the selected element. You can edit that rules and you will see the changes in real time.
Maybe you can check some videos to learn some basics about the Chrome Developer Tools, and after that if you want to learn more, you can check this question:
Chrome Developer Tools: Best resource for learning advanced features?
Here is a great tool for Google Chrome called Stylebot.
In this you can change the style sheet and save your own styles to any website for your own custom website theme!
Here is the link for Stylebot
Check it out and to put the icing on the cake, it's free!
This should not be used to work on your own website projects since the CSS file saves local on your browser!
In Chrome, clicking on something like "all.css:1" in the Styles pane of the Elements tab of DevTools takes one to the Sources tab of DevTools. If you're looking at code on remote server, the CSS rules in this source view are not live-editable (unlike the live-editing Style Editor tab of Firefox*) unless you're:
viewing the "inspector-stylesheet" -- a temporary stylesheet containing new style rules you created with the "+" button in the Styles pane of the Elements tab. Clicking on a new rule's "inpector-stylesheet:1" link will take you to the editable source of the temporary rules you've created.
viewing a persistent local workspace. Setting this up takes a few extra steps, described here: "Set Up Persistence with DevTools Workspaces" .
Basically, you make a local folder on your machine where you can save local copies that you direct Chrome to use in in lieu of the version on the internet. See the instructions at that link. Note that, as it says there, "If you are mapping files from a remote server instead of a local server, when you refresh the page, Chrome reloads the page from the remote server. Your changes still persist to disk and are reapplied if you continue editing in Workspaces." (So just type a space character into the source local CSS file to see your alterations applied again, if you've refreshed or navigated to a different page that uses the same stylesheet.)
* In Firefox, if you right-click on an element on a remote webpage, select Inspect Element, then in the Rules pane of the Inspector tab, click on a link on the right like "all.css:1", you are taken to a "Style Editor" tab where you can immediately live-edit, in contrast to Chrome's requirement of making you map to a local file. This may cause some people some confusion, if they expect the same behavior from Chrome's DevTools.
Another Chrome extension that is similar to Stylebot is Code Cola. It has an inspector that allows selecting elements, and a visual editor which does not require typing the CSS by hand. To see the generated CSS code click the curly brackets icon in the toolbar.
I am trying to chance the icon of the exe file created native bundling of javafx packaging but it still contains the default icon. Please suggest
primaryStage.getIcons().add(FileUtility.loadImage("icon.png"));
did not help, it only changes the title bar and task bar icon.
The ico file still gets generated and icon of the exe files remains the default one
I also tried to assign an icon in the project properties-> Deployment-> icon but did not help
I believe I have encountered the same issue and the solution is described in the following thread.
As a side note - neither specifying your icon in the build.xml file or via the project's options in the deployment section is going to work thus far, but it seems to be fixed in the upcoming release of 7u10.
I added response here How to set custom icon for javafx native package icon on Windows and thinks it is the same issue you started out with. However you seem to have moved on, but others might find it interesting...
I added src/main/deploy/package/windows/myapp.ico there and it finally worked :)
For you:
Create src/main/deploy/package/windows/ folder
Add icon with name ${project.build.finalName}.ico
Run mvn jfx:build-native
I haven't played with it extensively - just got it to work and wanted to share. So if you want to use icon with different name, I don't know how. Not yet at least. The ... section in the config section seems to be for webstart, so I haven't been using it. Hope you get it to work!
Answered at How to set custom icon for javafx native package icon on Windows