css - How to stretch a div vertically and horizontally to occupy all the space? -
this 2 part question, believe, third , fourth, bonus twist.
what doing wrong height of purple set 100% little bit high?
how can set width of purple goes 100% of remaining space?
is way rid of spacing between yellow , purple alter html code putting on same line?
how can remove margin green border holds between self , outer component?
div.faqticlelist { background: #ffdd00; /* yellow */ display: inline-block; padding: 3px; width: 200px; height: 150px; } div.faqticlepreview { background: #bb88ff; /* purple */ display: inline-block; padding: 3px; width: auto; height: 100%; }
i'm not sure if understand goals. assumed:
- fixed width left
- variable width right
css
body{ margin: 0; padding: 0; width: 100%; } div.faqticlelist { background: #ffdd00; width: 200px; height: 100%; float: left; } div.faqticlepreview { background: #bb88ff; width: 100%; height: 100%; margin-left: -203px; padding-left: 203px; } div.container { border: solid 1px #007700; margin: 0px; height: 100px; //overflow: hidden; //overflow: auto; } div.faqticlelist div, div.faqticlepreview div { padding: 3px; }
script
document.getelementbyid("faqticlelist").innerhtml = "<div>faqticlelist</div>"; document.getelementbyid("faqticlepreview").innerhtml = "<div>faqticlepreview</div>";
Comments
Post a Comment