Search jQuery

jQuery Forum

jsfiddle code need help jq mobile pages css codes

in jQuery Mobile • 5 months ago

heres my code i created

compulsory to use multipage method jquery mobile
i can not get the css code to work on my ui-login and ui-signup pages. my input box and buttons are showing up large on the andriod emulator and no colour.,etc . can some one help fix this problem. i spent days trying everything with no success. i still need to connect other pages to this index file also I have the same issue button etc are showing up wide.. so first i need to fix issue with css

thank you
www.https://jsfiddle.net/daisys77/s4b6hv2m/3/

w3school templates i am using there code. the buttons should be small not wide etc

please help

Replies(6)

watusiware

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

1. You didn't load either jQuery or jQuery Mobile JS, or jQuery Mobile CSS! You need to add them to fiddle "resources" section.

2. Your HTML is invalid. jsFiddle helpfully shows the syntax errors in red. You have end tags with no matching start tag. For example, you have a </form> but no <form>. And </div>s that don't have a matching <div>.

3. I would recommend that you use ANY instructional material OTHER than W3Schools. The jQuery Learning Center is a better place to learn.

https://learn.jquery.com/jquery-mobile/

There are many sites and locally-installable applications that can syntax-check your HTML. You should always check it. Even a good programming editor will check it for you.

watusiware

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

In addition to the problems I noted above, there was no ID ui-signup in the document, so that's why your link did not work. You used ui-sign which does not exist in your document.

I updated your fiddle (make sure you use the link from below)

https://jsfiddle.net/s4b6hv2m/16/

The logo does not show, because jsFiddle doesn't provide a way to upload images. If you want the logo to show, you need to provide a URL to an external file.

jsfiddle is not ideal for jQuery Mobile. It is better to use Plunkr.

taz21

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

Thank you so will my buttons on the page look small now as before when viewing the page on the emulator the button and text box where coming up large so the css code did not work

watusiware

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

I don't know what emulator you use, where you load your document from when using emulator, or if you loaded the CSS and JS correctly.

I fixed your Fiddle. That's all I can do with information given.

taz21

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

i have 1 index.html with many pages inside.

pages inside my index.html <div data-role="page" id="ui-page1"> <div data-role="page" id="ui-pages2"> <div data-role="page" id="ui-page3"> etc

i tryed naming each css page by the page name (example ui-page1) found in my index.hml. my problem the css does not load nothing is happening to button there suppose to small textbox also suppose to be small there should color etc. how am i suppose to load my multipage different css codes for each page has its own style code. i can not get this to work i am stuck please help.

i have installed all 3 jquery mobiles codes from their site into my webstorm app

watusiware

Re: jsfiddle code need help jq mobile pages css codes

5 months ago

We can't guess what you tried. Make a Fiddle.

I don't know what you mean by "CSS page".

To target a particular page, use an ID selector. For example:

#ui-page3 { font-size: 1.5em; }

You will need to understand CSS override rules, and it will be helpful to learn to use your desktop browser's built-in debug and inspection tools. If you want to change the style of something that is already styled by jQuery Mobile, then you will need to work-out an override using sufficient specificity.

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

If you need to learn about CSS, CSS selectors, and CSS overrides, MDN is a good place:

https://developer.mozilla.org/en-US/docs/Web/CSS

Top Reply

Response title

Attachments

jQuery Forum

jsfiddle code need help jq mobile pages css codes

Replies(6)

Re: jsfiddle code need help jq mobile pages css codes

Re: jsfiddle code need help jq mobile pages css codes

Re: jsfiddle code need help jq mobile pages css codes

Re: jsfiddle code need help jq mobile pages css codes

Re: jsfiddle code need help jq mobile pages css codes

Re: jsfiddle code need help jq mobile pages css codes

Statistics

Tags

Actions

Related Posts