css - Setting the width of HTML div's with %'s -


here relevant html:

    <div class="row">         <div class="arrow box">&#9668;</div>month year<div class="daymonth box"></div>&#9658;<div class="arrow box"></div>     </div> 

here css .html file above html in links to:

* {     margin: 0;      padding: 0;  }   body {     font-family: "times new roman";      font-size: 12pt;   }   .daymonth {     width: 80%;  }  .arrow {      width: 10%;  }  .row {     width: 58em;      background-color: gray;      margin-right: auto;      margin-left: auto;  }  .box {     float: left;      text-align: center;  } 

this output:

see description

the "row" centering in browser right stuff inside (the 2 arrows , month year) aren't doing want.

what think should doing is, because there 2 arrows , both of widths sent 10% , daymonth width 80% divs should take entire "row" (because sum 100%) , text "month year" should centered within "row" because .daymonth css class says should centered in div , because div should center 80% of "row". this, obviously, isn't happening though.

i don't want different solution (per se) want know why code i've written doesn't express idea want express, doesn't work way want to.

i think must misunderstanding how %'s governs widths. http://www.w3schools.com/css/pr_dim_width.asp says %'s "defines width in percent of containing block" though , looks %'s should intend them i'm thoroughly confused.

where have gone wrong?

this works fine me in opera.

i did notice have "month year" outside of <div>. try putting inside , see if fixes it.

edit
, again last arrow, it's outside <div> tag well.

your html should this:

<div class="row">     <div class="arrow box">&#9668;</div><div class="daymonth box">month year</div><div class="arrow box">&#9658;</div> </div>

also, once this, row <div> not have height might want explicitly set height (try 20px).


Comments

Popular posts from this blog

android - Spacing between the stars of a rating bar? -

html - Instapaper-like algorithm -

c# - How to execute a particular part of code asynchronously in a class -