[RESOLVED] using css to display inline
Im trying to display both the sub_menu and the sub_img div tags inline, so that the sub_img tag is to the right rather than underneath. I've spent the last hour trying different variations of the display css, i must be missing something and could do with a new pair of eyes.
Thanks in advance, Chris1990
HTML:
HTML Code:
<body>
<div id="sub_middle">
<div id="sub_menu" style="display:inline-block">
<ul>
<li><a href="/">Display Image One</a></li>
<li><a href="/">Display Image Two</a></li>
<li><a href="/">Display Image Three</a></li>
<li><a href="/">Display Image Four</a></li>
<li><a href="/">Display Image Five</a></li>
<li><a href="/">Display Image Six</a></li>
<li><a href="/">Display Image Seven</a></li>
</ul>
</div>
<div id="sub_img" style="display:inline-block"> </div>
</div>
</body>
CSS:
Code:
#sub_middle {
width:950px;
height:auto;
}
#sub_img {
width:600px;
height:250px;
background-color:#663366;
}
#sub_menu {
width:300px;
height:250px;
}
#sub_menu ul {
margin:0 0 10px 0;
padding:0;
width:300px;
}
#sub_menu ul li {
padding:2px 0 6px 7px;
background-image:none;
background-repeat:no-repeat;
background-color:#cccccc;
list-style-type:none;
line-height:26px;
margin:0;
}
#sub_menu ul li a {
list-style-type:none;
color:#1232EB;
font-size:110%;
font-weight:bold;
text-decoration:none;
display:block;
padding:0;
margin:0;
}
#sub_menu ul li a:hover {
color:#6F83F4;
}
Re: using css to display inline
dont know where i was going wrong, but its working now.