Button dropdown bs3

thank you, I like this better thank my first experiment.

I copied the html, css and js from codepen but as I enlarge the the window I’ve got this thing, did you have too? thank you.


also the submit button and reset button is located upon each other that is strange also, thank you,

Yes that’s why I wanted you to use my registration3 example as I fixed all those.

You have these rules with the wrong display:values. I have changed them around here.

form {
 /* display: inline-block;*/
  display:block;
  border: 1px solid;
  border-radius: 12px;
  padding: 12px;
}
input[type="reset"],
input[type="submit"] {
  /*display:block;*/
  display:inline-block;
  margin: 0.5em 0 0;
}

thank you, it is realy lovely. this ‘html page’ has a modal where remember me partneeds a small fixing, the remember me part needs to ‘pushed’ a bit from its checkbox. I found another crease thing, as choose city from dropdown list it is appearing in the city field. if I click on login right and up, it over rides the city appearing login. can you have a look? thank you.

You can fix the checkbox in the modal with this:

#login .checkbox input{position:static;margin-left:0}

You should have been able to detect that change from the code already given for the other checkboxes so please try to understand what these changes mean and how they work otherwise you are stuck on copying and pasting without learning.

That’s probably a scripting issue but before I go and look at it please fix the errors using the w3c validator.

You have used the same ID in some of your forms an dthat is not allowed even in the modal. All IDs must be unique.

Fix those errors first and then post a codepen with all the changes amalgamated so far and I will take a look at the issue (if it doesn’t automatically get fixed when you use valid html).

1 Like

yes I’ve done it but a few remained. specially the h2 tag that I don’t understand. please have a look, thank you.
registration3

thank you for help, I managed to fix the modal issue. there a few more. thank you.

If you need help with understanding an error message, then please quote the message here, and indicate which part of your code the error refers to.

thank you for help. I am adding a printscreen

also I found the field below the input field lost its color and its length stretches over input field. it wasn’t like that.

The warning is telling you that there is no content within your <h2></h2> tags.

 <h2 class="title"><span class="glyphicon headiconlabelmain glyphicon-user"></span></h2>   

yes it is empty but places user glyph in center, maybe this is not the right way, please help me, thank you.

I’m not sure I understand what you’re doing.

Heading tags - <h1> to <h6> - are used for headings. If your content is not a heading, then it is inappropriate to use a heading tag.

See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements.

yes I understand but is you click on login on cogepen example you will see a modal with on its top/header starting with a user glyph icon, then the title. I am afraid I made mistake with the code. please have a look, thank you.

As I said, you should only use heading tags for headings. A decorative glyph is not a heading, so don’t wrap it in <h2> (or any other heading) tags. As far as I can see, it would be more appropriate as a background image, but I’m not sure what the purpose of the image is, so perhaps there is a better solution.

It is important not to abuse headings, as they are used by assistive technology to help visually-impaired visitors navigate a page. Misusing them will make it difficult for these visitors to access your content.

thank you for help. can you help me to get this thing in a correct way? thank you.

I’ve told you what you need to do. I suggest you try and fix it yourself, and if you run into problems, then post a new question in a new thread, with your updated code. (You only need to post the code for the relevant section of the form, not the entire thing.)

We are here to help, not to provide ready-made solutions.

A post was split to a new topic: Centering modal title and glyph

A post was split to a new topic: Reset password validation not working

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.