pascallino
Gebruiker
- Lid geworden
- 29 dec 2009
- Berichten
- 167
Ik ben bezig met een mooie site.
Ik heb nu een soort sidebar gemaakt alleen hij staat op de verkeerde plek.
Ik heb een voorbeeld alleen als ik die hetzelfde heb staat hij nog op een andere plek.
Dit is mijn code:
CSS
Voorbeeld:
Eigen :
HTML
Voorbeeld:
Eigen:
Kan iemand helpen???
Bij voorbaat dank.
Met vriendelijke groet,
Pascallino
Ik heb nu een soort sidebar gemaakt alleen hij staat op de verkeerde plek.
Ik heb een voorbeeld alleen als ik die hetzelfde heb staat hij nog op een andere plek.
Dit is mijn code:
CSS
Voorbeeld:
Code:
/* Sidebar */
#sidebar {
float: right;
width: 273px;
padding: 0px;
color: #787878;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
margin: 0;
padding: 0;
}
#sidebar li ul {
margin: 0px 0px;
padding-bottom: 20px;
}
#sidebar li li {
line-height: 35px;
margin: 0px;
padding: 2px 0px;
border-left: none;
}
#sidebar li li span {
height: 19px;
margin-right: 16px;
padding: 4px 12px;
background: #3D2A0B url(images/img12.jpg) repeat-x left top;
font-size: 12px;
color: #FFFFFF;
}
#sidebar li li span a {
color: #FFFFFF;
}
#sidebar h2 {
height: 65px;
background: url(images/img09.jpg) no-repeat left bottom;
letter-spacing: -.5px;
font-size: 28px;
color: #493E2B;
}
#sidebar p {
margin: 0 0px;
padding: 0px 0px 30px 0px;
text-align: justify;
}
#sidebar p strong {
color: #4A3E29;
}
#sidebar a {
border: none;
}
#sidebar a:hover {
}
Code:
/* Sidebar */
#sidebar {
float: right;
width: 273px;
padding: 0px;
color: #787878;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
margin: 0;
padding: 0;
}
#sidebar li ul {
margin: 0px 0px;
padding-bottom: 20px;
}
#sidebar li li {
line-height: 35px;
margin: 0px;
padding: 2px 0px;
border-left: none;
}
#sidebar li li span {
height: 19px;
margin-right: 16px;
padding: 4px 12px;
background: #3D2A0B url(images/img12.jpg) repeat-x left top;
font-size: 12px;
color: #FFFFFF;
}
#sidebar li li span a {
color: #FFFFFF;
}
#sidebar h2 {
height: 65px;
background: url(images/img09.jpg) no-repeat left bottom;
letter-spacing: -.5px;
font-size: 28px;
color: #493E2B;
}
#sidebar p {
margin: 0 0px;
padding: 0px 0px 30px 0px;
text-align: justify;
}
#sidebar p strong {
color: #4A3E29;
}
#sidebar a {
border: none;
}
#sidebar a:hover {
}Voorbeeld:
HTML:
<div id="sidebar">
<ul>
<li>
<h2>Veroeros sit dolore</h2>
<p><strong>Donec turpis orci</strong> facilisis et ornare eget, sagittis eu massa. Quisque dui diam, euismod et lobortis sed etiam lorem ipsum dolor etiam nullam et faucibus. <a href="#">More…</a></p>
</li>
<li>
<h2>Categories</h2>
<ul>
<li><span>09.13.09</span><a href="#">Vestibulum risus vitae</a></li>
<li><span>09.13.09</span><a href="#">Condimentum et molestie</a></li>
<li><span>09.13.09</span><a href="#">Facilisis sed vestibulum</a></li>
<li><span>09.13.09</span><a href="#">Ipsum primis et sed luctus </a></li>
<li><span>09.13.09</span><a href="#">Ultrices posuere nulla </a></li>
<li><span>09.13.09</span><a href="#">Accumsan lorem sodales </a></li>
<li><span>09.13.09</span><a href="#">Scelerisque consectetur </a></li>
<li><span>09.13.09</span><a href="#">Maecenas quam aliquet</a></li>
</ul>
</li>
</ul>
</div>
HTML:
<div id="sidebar">
<ul>
<li>
<h2>Sidebar1</h2>
<p><strong>Hallo allemaal</strong> even testen</p>
</li>
<li>
<h2>Sidebar</h2>
<p>Everything about concrete5 is completely customizable through the CMS. This is a separate area from the main content on the homepage. You can <a title="Move blocks in concrete5" href="http://www.concrete5.org/documentation/general-topics/blocks-and-areas" target="_blank">drag and drop blocks</a> like this around your layout.</p>
<p> </p> </li>
</ul>
</div>Bij voorbaat dank.
Met vriendelijke groet,
Pascallino
