top
top2
left
middle
right
footer
dizilimli div lerden olusan
3 kolonlu layout orneklerine benzeyen bir calismam var her sey normal calisiyor
ve
asagidaki gibi bir CSS kodum var bu ayarlamalar ile IE calismasinda bir sorun yok ancak firefox ta calistirdigimda left ve right ornegin middle div icerigine gore daha az billgi icerdigi ici arka planida gosteriyor , middle div in uzunlugu degisken olabilecegine gore
bu ucune ( left middle right) sabit yukseklik vermek istemiyorum
ne yapmaliyim ? ayrica Firefox ve IE de sorun cikarabilecek CSS kodum varsa belirtirmisiniz ayrica gereken duzeltme varsa ?
tesekkurler
- Kod: Tümünü seç
#html,body {
padding:0; /*remove padding */
margin-left: 0px; /*content bosluklarini aldik*/
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
border:0; /* remove borders */
background:#f2f2f2; /*color background - only works in IE */
font-size:76%; /*set default font size */
font-family:trebuchet ms,Georgia,tahoma,Verdana, Arial, Helvetica, sans-serif;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow:auto; /*get rid of scroll bars in IE */
/* */
/* background-image:url(images/ladyfixed.jpg);
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-color: White; /*change color to suit*/
/* color : #000; /*change color to suit*/
}
#main_content {
background-color: White; /*change color to suit*/
margin:auto; /*0*/
width:800px;
height:100%;
border:solid 2px #ccc;
}
#top {
float:left;
background-color:#efefef;
width:800px;
height:125px;
background-image:url(images/soykansoft_top_image2.jpg);
}
#top2{
float:left;
background-color:#efefef;
width:800px;
height:25px;
padding-top:3px;
padding-bottom:3px;
}
#left {
float:left;
background-color:#ffffff;
width:200px;
height:auto;
}
#middle {
float:left;
background-color:#ffffff;
width:400px;
height:auto;
}
#right {
float:left;
background-color:#ffffff;
width:200px;
height:auto;
}
#footer {
float:left;
background-color:#99CCCC;
width:800px;
height:35px;
text-align:center;
border-top:solid 1px #ccc;
clear: both;
}
/* link renklendirmeleri */
a:link { text-decoration:none; color : #006699; }
a:active,a:visited { color : #006699; }
a:hover { text-decoration:underline; color : #fd1b04; }
/* scrolbar renklendirme sadece IE de calisir */
html, body{
scrollbar-face-color: #DEE3E7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #DEE3E7;
scrollbar-3dlight-color: #D1D7DC;
scrollbar-arrow-color: #006699;
scrollbar-track-color: #EFEFEF;
scrollbar-darkshadow-color: #98AAB1;
}
