Centering an element inside of a DIV using HTML/CSS -

-

i working on periodic table, , although got mass , number placed want them to, element symbol won't budge. tried everything: converting <p> <span> <div>, using display: block , setting margin: 0 auto, using text-align: center, still won't budge.

here's html:

        <div id = "a1" class="element alkalimetal">             <p>                 <span id = "anumber">118</span>                 <span id = "amass">9.008</span>             </p>             <br>             <div id = "symbol">h</div>         </div>         <div id = "a2" class = "element noblegas">          </div>

here's css:

#anumber{     font-family:arvo;     top: 0.1em;     position:relative;     vertical-align:super;     font-size:1.5em;     float:left;     padding-left:0.2em; }  #symbol{     width: 5em;     font-family: avenircondensed;     font-size: 5em;     text-align:center;     margin: 0 auto; }  #amass{     font-family:avenirnext;     top: 0.1em;     position:relative;     vertical-align:super;     font-size:1.5em;     float:right;     padding-right:0.2em } .element{     border: 1px solid black;     border-radius: 3px;     height: 8em;     width: 8em;     float: left; }

p.s.: table designed mobile want avoid using position:absolute or fixed margin widths.

change #symbol rule following:

#symbol{     /* width: 5em; remove */     font-family: avenircondensed;     font-size: 5em;     text-align:center;     /* margin: 0 auto; remove */ }

your width causing symbol spill on div sitting in, breaking flow. margin: 0 auto no longer needed after that.

also, side note, should using more classes instead of id's. id's intended elements used once per page. can set #symbol class .symbol .amass , anumber. allow set css rules once , use them each element in table.


Comments

Post a Comment

Popular posts from this blog

c++ - Creating new partition disk winapi -

-
i'am trying create new partition , mount volume new, thought createfile let me this, code : lpctstr lpfilename=l"\\\\.\\device\\harddisk0\\partition3"; handle handl=createfile( lpfilename, generic_read | generic_write, file_share_read | file_share_write, null, create_always, file_attribute_normal, null ); if (handl==invalid_handle_value) { qdebug()<<"handl invalid"<<" error"<<getlasterror();} bool success = definedosdevice(ddd_raw_target_path,l"i:",l"\\device\\harddisk0\\partition3"); if(!success) qdebug()<<" definedosdevice failed "<<getlasterror(); bflag = getvolumenameforvolumemountpoint( l"i:\\", // input volume mount point or directory /** u in dir
Read more

Android Prevent Bluetooth Pairing Dialog -

-
i'm developing internal application uses bluetooth printing. want bluetooth pairing occur without user input. have managed working trapping android.bluetooth.device.action.pairing_request broadcast. in broadcast receiver call setpin method, , pairing works ok, bluetoothpairingdialog displayed second or two, disappears - see link below. https://github.com/android/platform_packages_apps_settings/blob/master/src/com/android/settings/bluetooth/bluetoothpairingdialog.java since broadcast non-ordered, can't call abortbroadcast() , , wondering if there other way prevent pairing dialog appearing. can hook window manager in way? i haven't been able come way without modifying sdk. if you're oem, it's easy (i'm on 4.3): in packages/apps/settings/androidmanifest.xml, comment intent filter pairing dialog: <activity android:name=".bluetooth.bluetoothpairingdialog" android:label="@string/bluetooth_pairing_request"
Read more

VBA function to include CDATA -

-
i have following function include cdata: function cdatasection() dim objdom domdocument dim objkmlrootelement ikmldomelement dim objkmlelement ikmldomelement dim cdata ikmldomcdatasection set objdom = new domdocument set objkmlrootelement = objdom.createelement("balloonstyle") objdom.appendchild objkmlrootelement set objkmlelement = objdom.createelement("text") objkmlrootelement.appendchild objkmlelement set cdata = objdom.createcdatasection("text") cdata.data = "<![cdata[<b>latitude = $[latitude]</b>?]]>;" end function when run above, getting error "user defined data type not found" function. yes ripster says find library reference. vba window tools>references for list of relevant references see... http://msdn.microsoft.com/en-us/library/windows/desktop/ms763701%28v=vs.85%29.aspx however, if have hard time tracking down reference, replace dim sta
Read more