GenesisX
Legacy Member
Linkje - http://users.telenet.be/hydrofive/BROL/030 - prob.jpg
Zo ziet het eruit in ff en ie. En, zoals jullie wel kunnen verwachten, wil ik nu dat als die div opgevuld wordt en stretcht, de gehele lay-out mee stretch.
Ik heb hier al een tijdje gezocht -en zal er waarschijnlijk wel over gekeken hebben- maar ik vind niets dat mij kan helpen. Meestal gaat het over divs die de content niet tonen als hij opgevuld wordt of bg-images die mee moeten stretchen.
Sorry als het makkelijk te vinden is via google fzo, maar het is hier chaos alom en ik weet maar half op wat ik moet zoeken.
Hieronder mijn css:
Bedankt!
Zo ziet het eruit in ff en ie. En, zoals jullie wel kunnen verwachten, wil ik nu dat als die div opgevuld wordt en stretcht, de gehele lay-out mee stretch.
Ik heb hier al een tijdje gezocht -en zal er waarschijnlijk wel over gekeken hebben- maar ik vind niets dat mij kan helpen. Meestal gaat het over divs die de content niet tonen als hij opgevuld wordt of bg-images die mee moeten stretchen.
Sorry als het makkelijk te vinden is via google fzo, maar het is hier chaos alom en ik weet maar half op wat ik moet zoeken.
Hieronder mijn css:
Code:
/* CSS Document */
/* Padding and margin positioning order */
/* top right bottom left */
/* === BROWSER MARKUP === */
body {
margin: 0;
padding: 0;
text-align: center;
font-family: "Trebuchet MS", Tahoma, Helvetica, sans-serif;
font-size: 11px;
color: #343434;
background-image: url(../Images/BG_DECORATED_343434.gif);
background-repeat: repeat-x;
background-color: #343434;
}
body, html { height: 100% }
/* === GENERAL MARKUP === */
img { border: none; padding: 0 }
a { outline: none }
a:active{ outline: none }
/* === PAGELAYOUT MARKUP === */
#container {
margin-left: auto;
margin-right: auto;
width: 600px;
height: 99%;
}
#main {
background-color: #ffffff;
height: 100%;
padding: 3px;
margin: 0;
}
#header {
width: 594px;
margin: 0;
z-index: 2;
position: relative;
text-decoration: none;
}
/* === NAVIGATIONMENU MARKUP === */
#navigationmenu {
width: auto;
margin: 96px 0 0 12px;
padding: 0;
z-index: 8;
position: absolute;
font-weight: bold;
}
#navigationmenu ul {
list-style: none;
float: left;
width: auto;
margin: 0;
padding: 0;
font-variant: small-caps;
font-size: 12px;
}
#navigationmenu li { display: inline; margin-right: 10px; }
#navigationmenu li a, a:active, a:visited { text-decoration: none; color: #FFFFFF }
#navigationmenu li a:hover { text-decoration: none; color: #afc81c }
/* === LEFTBOX MARKUP === */
#lentry {
width: 179px;
text-align: left;
float: left;
position: relative;
padding: 0 0 0 3px;
margin: 3px auto;
background-image: url(../Images/LENTRY_HEADER_WITH_ICON.gif);
background-repeat: no-repeat;
background-position: top;
color: #343434;
text-decoration: none;
}
#lentry h1 {
font-weight: bold;
font-size: 11px;
padding-left: 28px;
padding-top: 2px;
margin: 0;
line-height: normal;
text-decoration: none;
}
#lentry p {
font-size: 11px;
margin: 0;
line-height: 116%;
white-space: normal;
padding: 8px 5px 5px 5px;
text-decoration: none;
}
#lentry a { text-decoration: none }
/* === CONTENT MARKUP === */
#content {
width: 410px;
float: left;
text-align: left;
position: relative;
margin: 4px 0 0 1px;
padding: 0;
height: 1px;
}
#contenttop {
background-image: url(../Images/CONTENT_TOP_ROUNDED.gif);
background-repeat: no-repeat;
background-position: top;
height: 5px;
margin: 0;
padding: 0;
}
#contentmiddle {
background-color: #343434;
margin: 0 1px 0 1px;
padding: 0 6px 1px 6px;
}
#contentmiddle h1 {
font-size: 13px;
color: #ffffff;
padding: 0 0 0 20px;
margin: 0;
}
#contentmiddle h2 {
font-size: 11px;
color: #ffffff;
padding: 0 0 0 20px;
margin: 10px 0 -10px 0;
}
#contentmiddle p {
padding: 0 0 0 20px;
margin: 10px 0 4px 0;
font-size: 12px;
color: #a2a2a2;
line-height: 100%;
}
#contentmiddle img { display: inline }
#contentmiddle .icon { float: left; display: inline }
#contentbottom {
background-image: url(../Images/CONTENT_BOTTOM_ROUNDED.gif);
background-repeat: no-repeat;
background-position: bottom;
height: 5px;
}
/* === CONTACTFORM MARKUP === */
/*
fieldset {
margin: 10px 0 0 20px;
padding: 0;
height: auto;
width: auto;
display: block;
border: 1px solid #afc81c;
}
legend {
margin: 0 0 0 15px;
padding: 2px 4px 2px 4px;
width: auto;
height: 14px;
background-color: #afc81c;
font-weight: bold;
}
*/
form#contact {
margin-left: 20px;
margin-top: 10px;
margin-bottom: 0;
}
div.row {
clear:both;
width:350px;
height:25px;
padding:0;
}
span.label {
padding: 0;
width: 62px;
float: left;
text-align: right;
display: block;
font-weight: bold;
margin-top: 4px;
}
span.label { color: #afc81c }
span.inputfield {
width: 160px;
float: left;
margin-left: 5px;
text-align: left;
}
form#contact .textfield {
margin: 0;
padding: 2px;
border: 3px solid #fff;
background-color: #afc81c;
width: 100%;
font-size: 10px;
}
form#contact textarea {
font-family: "Trebuchet MS", Tahoma, Helvetica, sans-serif;
font-size: 10px;
}
form#contact .submit {
font-size: 10px;
text-align: center;
background-color: #343434;
}
/* === FOOTER MARKUP === */
#footer {
position: relative;
margin-top: -17px;
margin-left: auto;
margin-right: auto;
background-color: #343434;
width: 600px;
height: 15px;
clear: both;
padding: 1px 2px 1px 2px;
font-size: 10px;
color: #ffffff;
text-align: left;
}
#footer a, a:active, a:visited { text-decoration: none; color: #ffffff }
#footer a:hover { text-decoration: none; color: #afc81c }
Bedankt!