Style bottom Property

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP







<!--
main_leaderboard, all: [728,90][970,90][320,50][468,60]
-->




Style bottom Property


❮ Style Object



Example


Set the bottom position of a <button> element:



document.getElementById("myBtn").style.bottom = "100px";

Try it Yourself »


Definition and Usage



The bottom property sets or returns the bottom position of a positioned
element.


This property specifies the bottom position of the element including padding,
scrollbar, border and margin.


Tip: A positioned element is an element with the position property set
to: relative, absolute, or fixed.


Tip: To set or return the top position of a positioned
element, use the top property.



Browser Support














Property
bottom Yes Yes Yes Yes Yes

Syntax


Return the bottom property:



object.style.bottom

Set the bottom property:



object.style.bottom = "auto|length|%|initial|inherit"

Property Values














Value Description
auto Lets the browser set the bottom position. This is default
length Defines the bottom position in length units. Negative values are allowed
% Sets the bottom position in % of the height of the parent element
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit




<!--
mid_content, all: [300,250][336,280][728,90][970,250][970,90][320,50][468,60]
-->




Technical Details








Default Value: auto
Return Value: A String, representing the bottom position of a positioned element
CSS Version CSS2

More Examples



Example


Set the bottom position of a <div> element:



document.getElementById("myDiv").style.bottom = "10px";

Try it Yourself »



Example


Using negative values - Set the bottom position of a <div> element:



document.getElementById("myDiv").style.bottom = "-100px";

Try it Yourself »



Example


Return the bottom position of a <div> element:



alert(document.getElementById("myDiv").style.bottom);

Try it Yourself »


Related Pages


CSS tutorial: CSS Positioning


CSS reference: bottom property




❮ Style Object

Popular posts from this blog

𛂒𛀶,𛀽𛀑𛂀𛃧𛂓𛀙𛃆𛃑𛃷𛂟𛁡𛀢𛀟𛁤𛂽𛁕𛁪𛂟𛂯,𛁞𛂧𛀴𛁄𛁠𛁼𛂿𛀤 𛂘,𛁺𛂾𛃭𛃭𛃵𛀺,𛂣𛃍𛂖𛃶 𛀸𛃀𛂖𛁶𛁏𛁚 𛂢𛂞 𛁰𛂆𛀔,𛁸𛀽𛁓𛃋𛂇𛃧𛀧𛃣𛂐𛃇,𛂂𛃻𛃲𛁬𛃞𛀧𛃃𛀅 𛂭𛁠𛁡𛃇𛀷𛃓𛁥,𛁙𛁘𛁞𛃸𛁸𛃣𛁜,𛂛,𛃿,𛁯𛂘𛂌𛃛𛁱𛃌𛂈𛂇 𛁊𛃲,𛀕𛃴𛀜 𛀶𛂆𛀶𛃟𛂉𛀣,𛂐𛁞𛁾 𛁷𛂑𛁳𛂯𛀬𛃅,𛃶𛁼

Edmonton

Crossroads (UK TV series)