Solved

Salesforce Apex not same result as my HTML page. Salesforce breaks it.

Posted on 2016-11-10
3
17 Views
Last Modified: 2016-11-27
I have created a page using HTML, jscript, css style sheets, etc. I have downloaded the stub.js and VFMetadataSender.js files that Salesforce adds to the header.

When I run my page as pure html with js and css source files, it looks beautiful.

However, when I put my css and js as static resources in Salesforce and run the page as an Apex page, my checkboxes are munged and it looks bad. I am using the exact same resources and code, other than when I create it at salesforce, I am using an apex page and the static resources pointing to the same code I use with the html.

I can't figure out what Apex/Salesforce is doing to my code to mess it up when it's so beautiful otherwise.

Any ideas what I can look at? Maybe someone else has had this problem with Salesforce breaking things.
thanks!
0
Comment
Question by:BobCSD
  • 2
3 Comments
 
LVL 7

Accepted Solution

by:
Rahul_Gade earned 500 total points
Comment Utility
Salesforce VF page by default include some css, and there are high chances that there is conflict between the css that you have defined and what SF has defined. Using browser's developers tool you can check with the conflict and update your css class name accordingly.
or try "showHeader=false" to reduce the default stylesheet inclusion.
0
 
LVL 1

Author Comment

by:BobCSD
Comment Utility
we already downloaded their included files by viewing the source code, and don't find at conflicts.
and we already have showheader = false.
0
 
LVL 1

Author Comment

by:BobCSD
Comment Utility
we just quit using salesforce static resources and use the script to a regular web path instead and it now works.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now