How do you pick were you put your button on js | SoloLearn: Learn to code for FREE!

0

How do you pick were you put your button on js

I now know how to make buttons but not how to pick were they are or there size

2/8/2017 7:23:55 PM

Caleb Moore

4 Answers

New Answer

+13

This might help with positioning and resizing… : https://code.sololearn.com/W0iXlaJRd2uA/?ref=app

+6

Since you mentioned that you didn't find the information helpful... css: -sets out styling rules for your html. If a button-element is created in html, then css is a nice way to take control... " position: relative; " makes the button easier to manage. html Now, something to consider is to drop your button inside a <div> and/or <span> tag. each div restricts the button to be positioned freely. <div> is basically a grid where you store contents. another way to explain this is by thinking of each div as a "frame". You can easily drop 5 divs inside each other. if you drop your button after those 5 then the button will be stored in that 5th frame (tight space). additional solution: If you wish to manage this in js then you should consider using the most popular javascript-library, jQuery. JQuery has an intimate contact with the elements itself, which in this case would be the button (-element). This lets you easily change behaviour of pretty much anything (such as animations, for instance). Bit of advice... Easily communicate with the button itself by defining classes or IDs. This can be done by either JQuery or HTML. You can in CSS also define the style on these classes/IDs. A class is defined in css by a dot and id gets defined with a hashtag. feel free to look this up on the web. Personally, I like using Bootstrap, because then you can basically skip CSS completely and simply just read about the built-in classes they have to offer. Google "btn class bootstrap". other quick style classes for your buttons in BS: btn-block, btn-default, btn-info, btn-warning and btn-danger. To add Bootstrap/jQuery simply put this in HTML section <body> tag: <script src="Google: bootstrap(or)JQuery CDN link (and replace it in these quotes)"></script> It should look something like this: <!DOCTYPE HTML> <html> <head> </head> <body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"> </script> </body> </html> Good luck! And feel free to ask if you have any thoughts around this. :)

+4

Many way exists to do it... Maybe didn't you have already much enough study Html/Css, but basically any html element ( so buttons ) is considered as an element in a text stream, so is positionned in regard of font, size... So you can organize your text stream in nested containers to handle a kind of relative positionning. Other ways to better build layout were appeared progressivly, so now, you can look at the 'float' css property, the 'position', the Flexbox model, in addition to originals behaviours of standard box model with property 'display' and it already wide choice. Well so, we can just provide you example of what we guess that "how do you pick you put your button on js" is meaning, probably not adapted to your case context ^^

0

that is 0% helpful