?
Onbekende gebruiker
13-03-2006 16:53
rel="StyleSheet"
Link gekopieerd
K
Kalle P
13-03-2006 16:55
gewijzigd op 13-03-2006 16:56
CSS:
/* CSS Document */
* {
margin: 0px;
padding: 0px;
}
#container {
margin: 0px auto;
width: 1023px;
}
#wrapper {
padding: 0px 100px;
}
#content {
min-height: 161px;
background: url(../images-algemeen/bg_content.jpg) center top repeat-y;
}
#header {
height: 77px;
background: url(../images-algemeen/bg_header.jpg) center top no-repeat;
}
#footer {
height: 85px;
background: url(../images-algemeen/bg_footer.jpg) center top no-repeat;
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #660000;
}
#menu {
float: left;
width: 125px;
/* De volgorde is, top, right, bottom, left. */
margin: 20px 10px 100% 5px;
}
#menu ul {
list-style-type: none;
font: 12px;
color: #660000;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #320733;
}
#test {
text-align: center;
margin: 0 70px 0 70px;
}
h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 28px;
font-weight: bold;
color: #660000;
padding-top: 16px;
}
p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #660000;
line-height: 150%;
padding: 0px 5px 10px 5px;
}
a:link {
color: #660000;
text-decoration: none;
font-weight: bold;
font-family: verdana;
font-size: 12px;
}
a:visited {
color: #660000;
text-decoration: none;
font-weight : bold;
font-family: verdana;
font-size: 12px;
}
a:hover {
color: #4E7C34;
text-decoration:overline underline;
font-weight : bold;
font-family: verdana;
font-size: 12px;
}
a:active {
color: #4E7C34;
text-decoration: none;
font-weight : bold;
font-family: verdana;
font-size: 12px;
}
Pagina:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>PLUSBEAUS Bearded Collies</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="imagetoolbar" content="no">
<link href="css/opmaak4.css" type="text/css" rel="StyleSheet">
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" type="text/css" href="css/opmaaknieuw.css">
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="content">
<div id="test">
<div class="contentpaginas">
<div id="menu">
<ul>
<li><a href="" alt="Home">Home</a></li>
<li><a href="" alt="Mail">Mail</a></li>
<li><a href="" alt="Contact">Contact</a></li>
<li><a href="" alt="News">News</a></li>
<li><a href="" alt="BeardieBoys">BeardieBoys</a></li>
<li><a href="" alt="BeardieGirls">BeardieGirls</a></li>
<li><a href="" alt="Voorstellen">Voorstellen</a></li>
<br>
<li><a href="" alt="Laatste Niews">Laatste Nieuws</a></li>
<li><a href="" alt="Pup Algemeen">Pup Algemeen</a></li>
<li><a href="" alt="Pup Planning">Pup Planning</a></li>
<li><a href="" alt="Pup Aanvraag">Pup Aanvraag</a></li>
<li><a href="" alt="Pup Gezondheid">Pup Gezondheid</a></li>
<li><a href="" alt="Pup Kamer">Pup Kamer</a></li>
<li><a href="" alt="Offspring">Offspring</a></li>
<br>
<li><a href="" alt="Dagboek">Dagboek</a></li>
<li><a href="" alt="BC Vraagbaak">BC Vraagbaak</a></li>
<li><a href="" alt="BC Vragen">BC Vragen</a></li>
<li><a href="" alt="BC Rasstandaard">BC Rasstandaard</a></li>
<li><a href="" alt="BC Nieuwsbrief">BC Nieuwsbrief</a></li>
<li><a href="" alt="BC Toplist">BC Toplist</a></li>
<br>
<li><a href="" alt="Art">Art</a></li>
<li><a href="" alt="Foto">Foto</a></li>
<li><a href="" alt="Linken">Linken</a></li>
<li><a href="" alt="Spiritueel">Spiritueel</a></li>
<li><a href="" alt="Ragdolls">Ragdolls</a></li>
<li><a href="" alt="Shows en Werken">Shows&Werken</a></li>
<li><a href="" alt="Gastenboek"><img src="images-algemeen/gastenboek.jpg" alt="Gastenboek" border="0"></a></li>
</ul> </div>
<center><img src="../images-algemeen/head1.jpg" alt="plusbeaus bearded collies" border="0"></center> <h1>Hier de content</h1>
de homepage<br>
<p>Nulla facilisi. Proin mollis porttitor arcu. Ut sodales sollicitudin elit. Fusce rhoncus varius nibh. Sed eget risus. In nibh lacus, mattis vel, hendrerit in, luctus id, velit. Sed erat. Aenean adipiscing. Fusce elit tellus, pharetra quis, tincidunt ut, gravida nec, ante. Nullam commodo nulla euismod nisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nulla eu dui. Quisque sit amet turpis at sem imperdiet lacinia. Nunc libero augue, elementum id, nonummy at, pellentesque eu, urna. Nunc orci. Etiam tristique placerat nisi. Nunc ac mi. Aliquam erat volutpat.</p>
<p>Vivamus in mi vitae purus ultricies pretium. Nam cursus elementum pede. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque nonummy rutrum felis. Etiam leo elit, vulputate ultrices, adipiscing eget, tempor a, elit. Nullam sit amet libero id nibh tempus suscipit. Suspendisse fringilla sagittis justo. Vivamus mattis, neque non dictum cursus, ipsum diam rhoncus lorem, eu aliquet enim tortor quis dolor. Vestibulum hendrerit tincidunt lorem. Maecenas eros lacus, malesuada sagittis, vestibulum nec, volutpat a, erat.</p>
<p>Sed nec lacus. Fusce pretium luctus odio. Maecenas gravida est sed tortor. Vivamus eros augue, tincidunt nec, lobortis sit amet, consectetuer quis, ligula. Curabitur dolor dui, molestie non, euismod nec, facilisis sed, lectus. Nullam luctus posuere lorem. Aenean ut nisl eleifend quam aliquam dignissim. Nullam a tortor non diam tempus dapibus. Etiam pellentesque dignissim eros. Nulla mattis turpis sed neque. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sed quam. Praesent varius arcu id dolor. Pellentesque condimentum euismod libero. Suspendisse rhoncus elementum lorem.</p>
<p>Suspendisse potenti. Praesent gravida, libero ut imperdiet facilisis, sem tortor aliquam nibh, in condimentum elit turpis quis turpis. Curabitur posuere fermentum tellus. Mauris odio ligula, lobortis ac, suscipit aliquet, tempor et, quam. Fusce non magna eget felis pretium facilisis. Vivamus pede. Donec purus dui, iaculis vitae, egestas quis, ultricies et, magna. Aliquam laoreet, eros vitae vestibulum mattis, quam sapien pellentesque ante, nec interdum dui elit eu sapien. Ut vitae lacus. Nunc quis lacus nec magna posuere posuere. Ut neque sem, dapibus ac, ullamcorper nec, fermentum non, felis. Curabitur quis dolor a risus suscipit accumsan. Fusce turpis arcu, sodales at, eleifend non, pulvinar eu, dolor. Suspendisse potenti. Suspendisse volutpat pede sed magna. Proin elit. Maecenas metus ante, molestie eget, volutpat eget, vestibulum id, nisi. Nulla nisl velit, lacinia ut, congue eget, hendrerit sed, leo.</p>
</div>
<br class="clear">
</div>
</div>
</div>
<div id="footer">
<center><b>Copyright ©1982 - 2006 PLUSBEAUS Bearded Collies. All rights Reserved.</b></center> </div>
</div>
</body>
</html>
Link gekopieerd
kijk es naar de width van je container
Link gekopieerd
das veel te groot, daarnaast staat je left padding van je menu maar op 5px
Link gekopieerd
L
Lissy Pixel
13-03-2006 18:08
gewijzigd op 14-03-2006 10:30
Kalle schreef op 13.03.2006 16:55
CSS:
Dank je wel!!
Dit heb ik letterlijk overgenomen en gemaakt maar helaas het werkt niet :(
edit : toppic actueel gemaakt en dode link weggehaald.
Link gekopieerd
Nu zie ik door de bomen het bos niet meer en weet ik neit waar jullie adviezen voor zijn dus ik heb nu alleen nog maar deze twee on-line:
Van Jan:
http://www.bearded-collies.net/index2.php
Van Renske:
http://www.bearded-collies.net/index1.php
@ Renske : ik heb je remarks aangepast maar ik kom geen steek verder... Wat doe ik nu fout?
@ Jan : dit zit ook vast voor wat betreft het doorlopen van de tekst waar je dit:
Eén ding waar je tegenaan zult lopen: hoe zorg je dat de tekst van de content
binnen de gouden randen blijft? Als je de padding van je content-div bijv op 100px links en rechts zet,
zal je content div breder worden omdat padding bij de breedte opgeteld wordt.
Tegen de tijd dat je zover bent moet je even een seintje geven, want daar weet ik ook iets op.
Aan me vertelde en ik zit nu te wachten hoe ik nu hiermee verder moet.
Ik snap het van de padding want dit heeft Renske me goed uitgelegd en heb ik de hele dag mee getest en geprobeerd :)
Wil je me verder helpen?
Link gekopieerd
K
Kalle P
13-03-2006 21:20
gewijzigd op 14-03-2006 10:31
lissy schreef op 13.03.2006 18:08
[quote=Kalle schreef op 13.03.2006 16:55]CSS:
Dank je wel!!
Dit heb ik letterlijk overgenomen en gemaakt maar helaas het werkt niet/quote]
Zie niks? Bij mij werkte het.
edit: dode link weggehaald
Link gekopieerd
Klop want ik zag door de bomen het bos niet meer en hij deed hetzelfde als de anderen.
Link gekopieerd
Sebastiaan schreef op 13.03.2006 16:53
rel="StyleSheet"
NOPE geeft totaal geen verschil maar ja ik weet niet of ik dit hier neer moet zetten gezien jouw opmerking tegen mijn in gezwam...... Dus vind je mijn feedback ook gezwam beschouw deze post dan als niet gepost.
Link gekopieerd
Ik weet niet of dat probleem al is opgelost, maar ik zou er een overflow in doen. overflow:auto;
Geen problemen en het past allemaal op één pagina.
(check:
dit , als mijn server aanstaat! om uurtje of half 3 denk weer ;-))
Link gekopieerd
