I know it must be something easy, but I can't figure this out. Summernote works fine if it is in the first page element of a JQM document, but if the summernote is in an external popup or on other pages in a multipage web, they summernote initialized but the icons are spaced oddly--see the fiddle). I have tried comparing the how the css are applied, and it looks like the JQM theme is overwriting the bootstrap css, though I am not sure (adding !important to all the bootstrap and summernote css is not an option--besides it must be a initialization or loading issue). Anyone have an idea?
If you host the JQuery Mobile scripts locally then you could edit/delete the parts that are causing the problem. Or you could use find and replace to add the important tags: Find:; Replace:!important;
Related
I have written a code for my html website project. When I open the html file itself, it loads correctly on various browsers. However, when I try to access the same file via localhost/xxxxx.html, the buttons don't seem to work. Other images and links work fine. All the files are placed within the same folder.
I have used a href along with the button element.
Can someone please help me? The project is due tomorrow and I am not a technology/coding native.
TIA!
The button element will not redirect you to the link you want because that's not what it is built for.
As you said, your link works fine, so you can use your link to navigate.
If you still want to use the button element, you can wrap it with the <form action="the_link_you_want_to_navigate" method="GET">. You can also use JavaScript code with a click event listener too.
But I think the best way to do this is by using the <a> tag and make it looks like a button using CSS properties.
Without seeing all your code it's tough to know why it's not working in your localhost. But... within the <button> element it's not typical to add an href the same way you would with an <a>. You can do it but with an onclick event in javascript.
I would suggest doing an Text and styling the .button class in your css.
Hopefully this helps and good luck on your project.
I'm trying to add a custom style on a product page in the Pinnacle Cart CMS. I've tried adding a <style> tag through the Source Code button in the content editor. Yet, it seems that <style> tags get destroyed by the CMS once you save your page. I'm not sure how else to inject custom CSS into a product page.
The only possible alternative that I see is that maybe I could apply the CSS globally, though the CSS system in Pinnacle Cart. Unfortunately, that could obviously cause problems in other pages wherein the CSS may apply to elements for which it is not intended.
EDIT:
I have also tried the following: going to "Cart Designer" for my site, going to the page in question, clicking on Advanced Tools, and then clicking "Edit custom css". However, when I do that, it seems that the CSS is not saved properly. If I check the custom CSS for that page, it shows up in the source editor. However, the custom stylesheet with my rules does not get served by the server when I request the page.
So I'm trying to get familiar with working with Flask bootstrap. However, one thing confuses me. I'm using http://getbootstrap.com/components/#navbar-fixed-top .
It tells me to add: body { padding-top: 70px; }
However, where does it want me to add it? I've added it manually to my html file, which works, but I'm working with blocks.
This is what it looks like now, which isn't the way it is suppose to be, I guess?
The place you are trying to add it looks fine. It just needs to be in any CSS file that gets loaded after the bootstrap CSS file. If you're inlining the CSS in your HTML, as it seems you are, and you're loading the bootstrap CSS correctly, from the <head> section of your page, then it will be loaded after the bootstrap, so that's ok. The only thing to bear in mind is that if you refactor the CSS into a separate file, the <rel> call to the page CSS file should go after the bootstrap CSS call.
What Flask calls blocks seem to essentially be templates, similar to those in backbone, ruby, mustache templates etc. When using these it can be helpful to let your page load in localhost, and inspect the source, so you'll be able to see how the final page loads, and where everything is loaded relative to other parts. However, the same principles should apply. With Flash you should be using the head block to load in the <head> section of your page.
I am having a bit of trouble trying to create a custom page template on Wordpress using the _tk theme (based on _s theme & Bootstrap). My issue is that I want to make the custom page template span the entire width of the content area after removing the side bar, but there is a class showing in the HTML inspector that is not allowing me to do this. I have included a screenshot to show what I mean.
I can remove the col-md-8 class from the inspector and it gets me the desired result, but I can't locate it in the PHP files to remove/modify it. I am fairly new to developing/designing with Wordpress, so I'm not sure if I am even going about this the right way.
Site I am working on: http://66.147.244.181/~slimbaby/phenomradio.
col-md-8 is found in header.php on Line #85.
You might want to simply override the CSS on that specific page though if you prefer not to edit header.php
I am using a jQuery CSS style on the main portion of my website. It works fine. Now, I also have a sub-directory of my website which should not use the style. When I manually navigate my browser to the sub-directory of the website, no style is applied which is what I want. When I click on a link to the sub-directory from the main area, however, it is applying the CSS style from the main part even though I am not referencing this CSS anywhere in the HTML of that sub-directory. If I refresh the browser, the style goes away.
Please can someone help me understand what is going on here? Thank you.
You are using jquery mobile, which by default loads the content of links via ajax. That means you don't have a page refresh when clicking on a link. The contents get dynamically inserted in your document which still has all your css.
More information here.
http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
You have to disable ajax for that link. More information here.
jquery-mobile - how can I bind disable ajax links to a certain class
Clear your history and browser data, then refresh and try.
Try to open the link in chrome and using the developer options (F12)
look for the resources it is referencing. If the page is referencing
the CSS files then either Javascript is making the referencing or
you have accidentally kept the resource link. Let the forum know your findings.
Edit
Somebody seems to have done what I have mentioned and has come to conclusions that they are because of AJAX. The steps I have mentioned above would let you do that all by yourself.