• 25-06-2010, 00:09:31
    #1



    Merhaba arkadaşlar footer kısmında iki alan oluşturdum ve bunu üstteki main kısmı ile eşitlenmesini istiyorum.
    Yani sol kısımdaki alan üstteki ile eşitlenicek, sağ kısmı ben bir şekilde eşitledim.

    Birde main alanının sol kenarlığı oval birde sağ kısmını oval yapmak istiyorum bunu nasıl yapabilirim?


    /*  
    Theme Name: iyzi
    Theme URI: http://www.slimmity.com/2009/12/free-wp-theme-simpleblog/
    Description: Sağlık, Genel kültür, Teknoloji, Gündem, Kişisel bilgilendirme, Biyografi, Otomobil <a href='http://www.iyzi.net'>yeni nesil bilgi</a>
    Version: 1.0
    Author: iyzi.net
    Author URI: http://www.iyzi.net/
    */
    
    /* Basic styles*/
    body {
        background:#e7e7e2 url(images/bg.png) top left repeat-x;
        font-family: 'Lucida Grande',Verdana,'Bitstream Vera Sans',Arial,sans-serif; 
        margin:0 auto;
        font-size:12px;
    }
    img { border:0;}
    a { outline-style:none;  }
    a:link ,a:active ,a:visited { text-decoration: none; color : #819eac; border: none;}
    a:hover    { text-decoration: none; color : #666464; border: none;} 
    textarea,input {color:#7b7d6f}
    p img {padding: 0;max-width: 100%;}
    img.centered,img.aligncenter {display: block;margin:0 auto;border:1px solid #c0c0c0;overflow:hidden;padding: 4px;}
    img.alignright {padding: 4px;margin: 2px 0 2px 7px;display: inline;border:1px solid #c0c0c0;}
    img.alignleft {padding: 4px;margin: 2px 7px 2px 0;display: inline;border:1px solid #c0c0c0;}
    .alignright {float: right;}
    .alignleft {float: left}
    acronym, abbr, span.caps {cursor: help;}
    acronym, abbr {border-bottom: 1px dashed #999;}
    .center {text-align: center;}
    .hidden {display: none;}
    .aligncenter,div.aligncenter {display: block;margin-left: auto;margin-right: auto;}
    
    #wrapper {margin:0 auto;width:880px;}
    #wrapper #header {clear:both;height:75px; width:840px;padding:7px 20px;background:url;}
    #wrapper #main {
    background:url("images/body_middle.png") repeat-y scroll left top #FFFFFF;
    clear:both;
    overflow:hidden;
    padding:0;
    width:850px;
    }
    #wrapper #footer {
    background:url("images/body_bottom.png") no-repeat top left #e7e7e2; 
    overflow:hidden;
    padding:30px 30px 10px 20px;
    width:830px;
    }  
    #header #logo { width:280px; float:left;}
    #header #nav {width:560px; float:right;}
    
    #header #nav .pages, #header #nav .pages * {margin:0; padding:0;list-style:    none;}
    #header #nav .pages { float:right; margin-top:18px;}
    #header #nav .pages li {display:inline; float:left; margin-right:5px;}
    
    #header #nav .pages li a:link, #header #nav .pages li a:visited, #header #nav .pages li a:active {color:#426372;font-size:14px;height:34px;line-height:34px;padding-right:10px;}
    #header #nav .pages li a:hover {color:#5d6061;background:transparent url(images/navbg.png) repeat scroll top right;float:left}
    #header #nav .pages li a:hover span {background:transparent url(images/navbg.png) repeat scroll left top;display:block;}
    #header #nav .pages li.current_page_item a:visited,#header #nav .pages li.current_page_item a:active,#header #nav .pages li.current_page_item a:link {background:transparent url(images/navbg.png) repeat scroll top right;color:#5d6061;float:left}
    #header #nav .pages li.current_page_item a:visited span,#header #nav .pages li.current_page_item a:active span,#header #nav .pages li.current_page_item a:link span {background:transparent url(images/navbg.png) repeat scroll left top;display:block;}
    #header #nav .pages li a:link span, #header #nav .pages li a:visited span, #header #nav .pages li a:active span  {padding-left:10px;}
    #main #content { width:540px; float:left; margin:10px;}
    #main #sidebar {width:280px; float:right;line-height:18px; margin-right:10px;}
    #footer .footer-left h1,.post .entry h2,.post .entry h3,.post .entry h4 {margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}
    #footer .footer-left h3 { font-size:14px;}
    #footer .footer-left { float:left; width:45%;}
    #footer .footer-left .widget h4 {
    border-bottom:1px solid #D9D9D9;
    color:#575757;
    font-size:14px;
    font-weight:400;
    margin:0;
    padding:0 0 5px 15px;
    }
    #footer .footer-left { float:left; width:45%; text-align:left;}
    #footer .footer-left ul { list-style:none; font-size:11px; margin:5px 0; padding:0;}
    #footer .footer-left ul li { background:url(images/icon_bullet.png) 5px 2px no-repeat; padding:0 0 7px 24px;}
    .footer .categories .footer-left ul li { width:40%; float:left; margin:0;}
    #footer .footer-right { float:right; width:45%;}
    #footer .footer-right { float:right; width:45%; text-align:left;}
    #footer .footer-right ul { list-style:none; font-size:11px; margin:5px 0; padding:0;}
    #footer .footer-right ul li { background:url(images/icon_bullet.png) 5px 2px no-repeat; padding:0 0 7px 24px;}
    .footer .categories .footer-right ul li { width:40%; float:left; margin:0;}
    #footer .left { float:left; width:45%;}
    #footer .right { float:right; width:45%; text-align:right;}
    
    .widget { margin-bottom:20px; padding:0; overflow:hidden;clear:both; }
    .widget h4 { font-size:14px; margin:0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}
    .widget ul { list-style:none; font-size:11px; margin:5px 0; padding:0;}
    .widget ul li { background:url(images/icon_bullet.png) 5px 2px no-repeat; padding:0 0 7px 24px;}
    .widget_categories ul li { width:40%; float:left; margin:0;}
    .widget_rssfeed {color:#727576;font-size:14px; padding:0 10px;}
    .widget_rssfeed ul li {margin-bottom:5px;}
    .widget_rssfeed ul li.rss { background:url(images/rssfeed.png) 0 0 no-repeat; padding:6px 0 10px 38px;font-size:16px;}
    .widget_rssfeed ul li.email { background:url(images/mail.png) 0 0 no-repeat; padding:6px 0 10px 38px;font-size:16px;}
    .widget_rssfeed ul li.twitter { background:url(images/twitter.png) 0 0 no-repeat; padding:6px 0 10px 38px;font-size:16px;}
    .widget_search form { padding:0 10px;}
    .widget_search input{width:63%;padding:5px; margin:0 5px 10px 0;background:#f8f8f5 url(images/random.png) top left repeat-y;border-left:1px solid #dddbd4;border-top:1px solid #dddbd4;border-right:1px solid #f5f5f1;border-bottom:1px solid #f5f5f1;}
    .widget_search input#searchsubmit { width:70px;margin-top:10px; background:url(images/submit.png) top left repeat-x;color:#ffffff;padding-bottom: 3px;border:1px solid #94c1cd;}
    
    
    .post {border-bottom:1px solid #d9d9d9;color:#6e6e6e;padding-bottom:5px;margin-bottom:20px;}
    .post .title { width:480px!important;width:460px; float:left; padding-bottom:5px;}
    .post .title h2 { color:#000000; font-size:15px;margin:0;padding:0 0 7px 0;}
    .post .title h2 a { color:#000000;}
    .post .title h2 a:hover { color:#66808d;}
    .post .title .meta { color:#858585; font-size:11px;}
    .post .title .meta a { background-color:#a2c2d1; color:#ffffff; padding:4px;} 
    .post .title .meta a:hover { background-color:#000000; } 
    .post .commentcount { font-weight:600;font-size:11px;width:35px; height:28px;text-align:center;margin:0 7px 0 10px;padding-top:8px; float:left; background:url(images/commentcount.png) top left no-repeat;}
    .post .commentcount a {color:#6e6e6e;}
    .post .entry {line-height:22px;padding:10px;display:block; clear:both; overflow:hidden;color:#787575;}
    .post p { margin:0; padding:0 0 10px 0;}
    .post blockquote { background:transparent url(images/quote.png) no-repeat scroll 0 0;font-size:0.9em;font-style:italic;line-height:1.5em;margin:5px 0 5px 0;padding:10px 15px 10px 60px;}
    .post ul.split3cols,.post ul.split2cols {font-size:12px;overflow:auto;width:520px;}
    .post ul {list-style-type:none;margin:10px 0;padding:0 0 0 10px;}
    .post ul.split3cols li { float:left;width:155px;margin-right:5px;}
    .post ul.split2cols li { float:left;width:240px;margin-right:5px;}
    .post ul li { background:transparent url(images/bullet.png) no-repeat scroll 0 8px;line-height:20px;margin:4px 0;padding:0 0 0 10px; }
    .post .entry h1,.post .entry h2,.post .entry h3,.post .entry h4 {margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}
    .post .entry h1 { font-size:16px;}
    .post .entry h2 { font-size:15px;}
    .post .entry h3 { font-size:14px;}
    .post .entry h4 { font-size:13px;}
    
    .page h2 {  font-size:24px; margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}
    .page .entry {line-height:22px;padding:0 10px;display:block; clear:both; overflow:hidden;color:#787575;}
    .page p { margin:0; padding:0 0 10px 0;}
    .page blockquote { background:transparent url(images/quote.png) no-repeat scroll 0 0;font-size:0.9em;font-style:italic;line-height:1.5em;margin:5px 0 5px 0;padding:10px 15px 10px 60px;}
    .page ul.split3cols,.page ul.split2cols {font-size:12px;overflow:auto;width:520px;}
    .page ul {list-style-type:none;margin:10px 0;padding:0 0 0 10px;}
    .page ul.split3cols li { float:left;width:155px;margin-right:5px;}
    .page ul.split2cols li { float:left;width:240px;margin-right:5px;}
    .page ul li { background:transparent url(images/bullet.png) no-repeat scroll 0 8px;line-height:20px;margin:4px 0;padding:0 0 0 10px; }
    .page .entry h1,.page .entry h2,.page .entry h3,.page .entry h4 {margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}
    .page .entry h1 { font-size:16px;}
    .page .entry h2 { font-size:15px;}
    .page .entry h3 { font-size:14px;}
    .page .entry h4 { font-size:13px;}
    
    .bookmarks {margin-bottom:15px;padding:40px 10px 20px 15px;border-bottom:1px solid #d9d9d9;color:#6e6e6e;background: url(images/bookmarkthis.png) 10px 10px no-repeat;overflow:hidden;clear:both;}
    .bookmarks span{ font-size:12px; line-height:20px;}
    .bookmarks ul { list-style:none; margin:0; padding:10px; overflow:hidden; clear:both;}
    .bookmarks ul li { float:left; padding:1px 10px 3px 20px;}
    .bookmarks ul li a:link,.bookmarks ul li a:visited { color:#666666;}
    .bookmarks ul li a:hover { color:#a2c2d1;}
    .bookmarks ul li.df { background:url(images/fav/designfloat.png) 0 0 no-repeat;}
    .bookmarks ul li.digg { background:url(images/fav/digg.png) 0 0 no-repeat;}
    .bookmarks ul li.del { background:url(images/fav/delicious.png) 0 0 no-repeat;}
    .bookmarks ul li.techno { background:url(images/fav/technorati.png) 0 0 no-repeat;}
    .bookmarks ul li.su { background:url(images/fav/stumbleupon.png) 0 0 no-repeat;}
    
    #comments { padding:0 0 0 15px; margin:0; font-size:14px;}
    .commentlist { list-style:none; padding:10px 20px 0 20px;margin:0; overflow:hidden;clear:both;}
    .commentlist li { border-bottom:1px solid #d9d9d9; padding-top:10px;margin-bottom:10px;}
    .commentlist p { color:#000000;line-height:20px; padding:0 10px;}
    .commentlist .comment-author { color:#000000; }
    .commentlist cite, .commentlist cite a {font-weight: bold;font-style: normal;}
    .commentlist .comment-author a:link,.commentlist .comment-author a:visited{ color:#7c9dac; }
    .commentlist .comment-author a:hover{ color:#838383; }
    .commentlist .comment-author .avatar {float:right; border:1px solid #ffffff; padding:3px;}
    .commentlist .comment-meta a { font-size:10px;color:#a0a09f;}
    .commentlist .reply { padding:0px 10px 5px 10px; }
    
    #comment-form,.commentform { padding:0 15px; margin:0; font-size:11px;color:#000000;}
    #comment-form h3,.commentform h3 { font-size:14px; }
    #comment-form form ,.commentform form { padding:0 20px; margin:0;}
    #comment-form label,.commentform label {margin:0 10px 0 0;}
    #comment-form input,.commentform input { width:70%;padding:5px; margin:0 10px 10px 0;background:#f8f8f5 url(images/random.png) top left repeat-y;border-left:1px solid #dddbd4;border-top:1px solid #dddbd4;border-right:1px solid #f5f5f1;border-bottom:1px solid #f5f5f1;}
    #comment-form input.submit,.commentform input.submit { width:100px;float:right;margin-top:10px; background:url(images/submit.png) top left repeat-x;color:#ffffff;padding-bottom: 3px;border:1px solid #94c1cd;}
    #comment-form textarea,.commentform textarea { width:94%;background:#f8f8f5 url(images/random.png) top left repeat-y;border-left:1px solid #dddbd4;border-top:1px solid #dddbd4;border-right:1px solid #f5f5f1;border-bottom:1px solid #f5f5f1;padding:10px;}
    
    .comment-nav { padding:0px; }
    
    .wp-caption {border: 1px solid #ddd;text-align: center;background-color: #f3f3f3;padding-top: 4px;margin: 10px;-moz-border-radius: 3px;-khtml-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;}
    .wp-caption img {margin: 0;padding: 0;border: 0 none;}
    .wp-caption p.wp-caption-text {font-size: 11px;line-height: 17px;padding: 0 4px 5px;margin: 0;}
    
    #footer .footer-right{
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    background:#FFF;
    width:400px;
    }
    #footer .footer-left    h2  {
    font-family: Arial, sans-serif;
    font-size: 15px;
    padding-bottom: 3px;
    border-bottom: 1px solid #d9d9d9;
    }
    
    
    #footer .footer-left{
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    background:#FFF;
    width:400px;
    }
    
    #footer .footer-right    h2  {
    font-family: Arial, sans-serif;
    font-size: 15px;
    padding-bottom: 3px;
    border-bottom: 1px solid #d9d9d9;
    }
  • 25-06-2010, 00:12:42
    #2
    #footer .footer-left h1,.post .entry h2,.post .entry h3,.post .entry h4 {margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}

    padding soldan 15px vermişsiniz. Nedeni bu olabilir.
  • 25-06-2010, 00:20:27
    #3
    Hkan adlı üyeden alıntı: mesajı görüntüle
    #footer .footer-left h1,.post .entry h2,.post .entry h3,.post .entry h4 {margin:0 0 5px 0; padding:0 0 5px 15px; color:#575757;font-weight:400;border-bottom:1px solid #d9d9d9;}

    padding soldan 15px vermişsiniz. Nedeni bu olabilir.

    Hocam onunla ilgili değil onu düşürünce yada arttırınca bir değişiklik olmuyor.
  • 25-06-2010, 00:28:51
    #4
    Herhangi bir yere şunu ekler misiniz CSS'de:

    #footer {margin:0;padding:0;}
  • 25-06-2010, 00:29:57
    #5
    Hkan adlı üyeden alıntı: mesajı görüntüle
    Herhangi bir yere şunu ekler misiniz CSS'de:

    #footer {margin:0;padding:0;}

    En alt kısma ekledim hocam bir değişiklik olmadı.
  • 25-06-2010, 00:32:52
    #6
    oval yapma olayını webkitle halledebilirsin hocam
  • 25-06-2010, 00:35:24
    #7
    Linkinmetin adlı üyeden alıntı: mesajı görüntüle
    oval yapma olayını webkitle halledebilirsin hocam

    Hocam css kodları çok karışık anca tek taraflı yapabildim çift taraflı yapmayı bir türlü beceremedim.

    Bilen başka birisi var mı?
  • 25-06-2010, 09:08:40
    #8
    #wrapper #footer {
    background:url("images/body_bottom.png") no-repeat top left #e7e7e2;
    overflow:hidden;
    padding:30px 30px 10px 20px;
    width:830px;
    }

    bununla değiştirip denermisin:

    #wrapper #footer {
    background:url("images/body_bottom.png") no-repeat top left #e7e7e2;
    overflow:hidden;
    padding:30px 30px 10px 0px; /* genisliği artırınca burda sondaki 0px i yükseltebilirsin yerine tam oturmazsa*/
    width:850px; /* 880px ede çıkarıp deneyebilirsin */
    }

    olmazsa sayfayı canlı görmem lazım gene teorisel bir cevap oldu.

    ovalliğin bozulması da belki bunu bu şekilde değiştirince kendiliğinden düzelir
  • 25-06-2010, 20:48:57
    #9
    justices adlı üyeden alıntı: mesajı görüntüle
    #wrapper #footer {
    background:url("images/body_bottom.png") no-repeat top left #e7e7e2;
    overflow:hidden;
    padding:30px 30px 10px 20px;
    width:830px;
    }

    bununla değiştirip denermisin:

    #wrapper #footer {
    background:url("images/body_bottom.png") no-repeat top left #e7e7e2;
    overflow:hidden;
    padding:30px 30px 10px 0px; /* genisliği artırınca burda sondaki 0px i yükseltebilirsin yerine tam oturmazsa*/
    width:850px; /* 880px ede çıkarıp deneyebilirsin */
    }

    olmazsa sayfayı canlı görmem lazım gene teorisel bir cevap oldu.

    ovalliğin bozulması da belki bunu bu şekilde değiştirince kendiliğinden düzelir



    Hocam 880px'e çıkartınca düzeldi sol köşe çok kusursuz duruyor birde sağ köşeyi sol ile aynı yapabilirsek çok ama çok güzel olucak bunu nasıl yapabiliriz?
    Bu arada sağ kısımdaki tablonun sağ kenarlarının ovalliğide gitti? :S