portokalakias
New Member
I have two sections of my website that should be displaying in a similar manor. One displays correctly, while the other does not. The top one puts each element on its own line, while the bottom puts the above and the two images side by side how I want them.My two questions are:1: Why is the broken version broken?2: What part of the working version is enabling it to display properly (or a better follow up question, what parts of the css are not aiding in it displaying properly and can be deleted?Broken:html:\[code\]<div id="maintitle"><span id="chara1"><img src= "http://stackoverflow.com/questions/13715912/<?= $charused ?>" width="150" alt="char2"/></span><span id="maintitletext"><h1> Welcome to Born4battle's Wolfenstein 3D page</h1></span><span id="chara2"><img src= "http://stackoverflow.com/questions/13715912/<?= $charused ?>" width="150" alt="char2"/></span></div>\[/code\]css:\[code\]#maintitle{color: #ffff00;text-align: center;}#maintitle ul{margin:0;padding: 0;list-style-type: none;}#maintitle li{display: inline;}#chara1, #chara2, #maintitletext{margin-top: 0px;margin-right: auto;margin-left: auto;display: inline;padding: .5em;width: 110px;}\[/code\]Working:html:\[code\]<div id="share"><p> Get the official shareware for Wolfenstein 3D and Spear of Destiny below </p><span id="getwolf"><a href="ftp://download.dosgamesarchive.com/wolf3d.zip"><img src="http://www.timsooley.com/wolfnow.gif" alt="getwolf"></a></span><span id="getspear"><a href="ftp://download.dosgamesarchive.com/destiny.zip"><img src="http://www.timsooley.com/getspear.gif" alt="getspear"></a></span></div>\[/code\]css:\[code\]#share ul{margin: 0;padding: 0;list-style-type: none;}#share li{display:inline;}#getspear, #getwolf{margin-top: 0px;margin-right: auto;margin-left: auto;display: inline;/*background: #bbbbbb;border-top: solid 2px #333333;border-left: solid 2px #333333;border-right: solid 3px #999999;border-bottom: solid 3px #999999;*/padding: .5em;width: 110px;}\[/code\]