css - html and svg sizing issue -
i have following html structure:
html
<div class="row"> <div class="cell">1234</div> <div class="cell">5678</div> </div> <div class="row"> <div class="cell">1234</div> <div class="cell"><div><svg width="100%" height="100%"></svg></div></div> </div>
css
.row { display: table-row; background-color: #dadada; } .cell { display: table-cell; width: 50px; height: 25px; }
can tell me why row svg
cell higher 25px
?
note
the svg
rendered library, can't set height.
well, clarified issue both codes of yours, since svg inline
element default, need use vertical-align: top;
inorder rid of height
disturbance..
svg { vertical-align: top; }
it better if assign id
svg element , modify selector accordingly.
Comments
Post a Comment