çözülmüşarkadaslar,
Temamin ustune yatay bir js menu ekledim (dolphinnav).
Menu calisiyor gayet guzel. Ama bir sorun var. Header.gif in ustunde kaliyor.
oysa ben resmin bittigi yerde olmasini istiyorum.
temanin style.css dosyasindan header.gif in yuksekligini 200 piksele cikarmama ragmen degisen bir sey olmadi.
nasil yapabilirim ?
hatali goruntu :
styl kodlarını yazarsan yardımcı olurum sanırım sorun header yüksekligi ile resmin yüksekligi birbirinin tutmuyor
stlye.css dosyam asagidaki gibidir.
header.gif resmin boyutu ise 760x175 px
asagidaki
#header {
height: 200px;
kismini ben 200 yaptım. onceden 150 idi. 200 yapsamda menu asagiya inmedi. yine resmin uzerinde.
yardım icin simdiden tesekkurler.
/*
Theme Name: fMulti
Theme URI: http://www.fahlstad.se
Description: A theme with multiple columns
Version: 1.0
Author: Fredrik Fahlstad
Author URI: http://www.fahlstad.se
*/
* {
padding:0;
margin:0;
}
body {
font: normal 12px "Lucida Grande", "Verdana", sans-serif;
color: #222;
background-image: url(images/bodybg.gif);
}#wrap {
width: 780px;
margin-right: auto;
margin-left: auto;
background-color: #343839;
border: 1px solid #3e4243;}
#header {
height: 200px;
background-color: #343839;
background-image: url(images/header.gif);
background-repeat: no-repeat;
margin: 10px;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Georgia", "Times New Roman", Times, serif;
font-weight: normal;
}h1#blogname{
margin:0;
padding:9px;
}
h1#blogname a
{
color:#FFFFFF;
font-size:xx-large;
font-weight: normal;
letter-spacing: -2px;
}
#content {
float: left;
width: 535px;
background-color: #343839;
padding:0px;
margin-right: 10px;
margin-bottom: 10px;
padding-left: 10px;
color:#999999
}
#sidebar {
float: right;
width: 180px;
margin-top: 0px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 0px;
background-color: #2E3233;
padding:15px;
display:inline;
color:#dddddd;
border: 1px solid #3e4243;
}
#footer {
text-align: center;
clear: both;
height:30px;
color:#999999;
padding:10px;
margin-right:0
}
.entrybody {
color:#999
}
.entrybody p {
padding: 0;
margin: 0 0 1.7em 0;
font: normal 14px/1.6em "Trebuchet MS", "Tahoma", sans-serif;
color: #AAAAAA;
}
.comments_link a img{
border:0;
}a, a:visited {
font-weight: bold;
color: #ff9933;
text-decoration: none;
}a:hover {
text-decoration: underline;
}
/*font: bold 20px/1.1em "Trebuchet MS", "Verdana", sans-serif; }*/
h3.entrytitle {
padding: 0;
margin-bottom: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 20px;
line-height: 1.1em;
}h3.entrytitle a, h3.entrytitle a:visited {
color: #FFA200;
text-decoration: none;
}h3.entrytitle a:hover{
color: #00ff33;
text-decoration: underline;
}h3 a {
text-decoration: none;
border: 0;
color: #000;
}
div .entrybody h3, div .entrybody h2{
margin-bottom:10px;
color:#B37100;}
h3 a:hover {
text-decoration: none;
border: 0;
text-shadow: none;
color: #333;
}
#sidebar h2 {
font-weight: bold;
color: #dddddd;
font-size: 110%;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #555;
margin-bottom: 10px;
}
#sidebar p{
margin: 10px;
color:#999999;
line-height: 1.4em;
}
#sidebar a,#sidebar a:visited {
color:#ffa200;
text-decoration:none;
}
#sidebar a:hover {
color:#00ff33;
text-decoration:underline;
}#sidebar ul li {
list-style-type: none;
list-style-image: none;
margin-bottom: 15px;
margin-left: 10px;
}#sidebar ul p, #sidebar ul select {
margin: 5px 0 8px;
}#sidebar ul ul, #sidebar ul ol {
margin: 5px 0 0 10px;
}#sidebar ul ul ul, #sidebar ul ol {
margin: 0 0 0 10px;
}ol li, #sidebar ul ol li {
list-style: decimal outside;
}#sidebar ul ul li, #sidebar ul ol li {
margin-top: 3px;
margin-right: 0em;
margin-bottom: 0em;
margin-left: 0.5em;
padding-top: 0.1em;
padding-right: 0;
padding-bottom: 0.1em;
padding-left: 0;
list-style-type: none;
list-style-position: outside;
list-style-image: url(images/bull.gif);
}.firstpost p.comments_link, .entrybody p.comments_link {
margin:0;
}
.firstpost {
background-color: #2E3233;
border: 1px solid #3e4243;
padding: 10px;
margin-bottom:15px;
background-image: url(images/latest.gif);
background-repeat: no-repeat;
background-position: right bottom;
}
.entry{
background-color: #2E3233;
border: 1px solid #3e4243;
padding: 10px;
margin-bottom:15px;
}
#searchdiv {
margin-bottom: 15px;
}
.arc {
border: 1px solid #3e4243;
background-color:#2E3233;
padding:10px;
color:#FFFFFF;
margin-bottom:15px;
}
.entrymeta {
font-size: 13px;
margin-bottom: 20px;
}
#description {
font-weight: bold;
color: #FFFFFF;
font-size: 12px;
margin-top: 40px;
margin-right: 20px;
text-align: center;
}.entry ul, .entry ol{
margin-left:30px;
list-style:disc;
margin-top:10px;
margin-bottom:10px;
}
.entry ul li,.entry ol li {
padding-top:5px;
line-height:1.5em;
}dl{
margin-bottom:10px;}
dt{
margin-left:10px;
font-weight:bold;}
dd{
margin-left:20px; padding-top:5px;
line-height:1.5em;
}
/************************************************
* Comments *
************************************************/
h2#comments{
padding:2px;
margin-bottom:10px;
margin-top:30px;
font-size: 110%;
color:#FF9900
}
#commentblock {
padding: 20px;
color:#999999;
clear: both;
}ol#commentlist {
margin-top:0px;
padding: 5px;
margin-left: 20px;
color: #9b9b9b;
font-size:0.9em;
}#commentlist li p{
margin-bottom: 8px;
line-height: 20px;
padding:0;
}.commentname {
margin: 0;
padding: 0 0 2px 0;
font-weight: bold;
}.commentinfo{
margin-top: 3px;
margin-bottom: 5px;
}.commenttext {
clear: both;
margin-top: 0px;
margin-bottom: 30px;
border-top: 1px solid #000;
line-height:12px;
color: #999;
background-color: #2E3233;
padding: 5px;
}.commenttext-admin {
clear: both;
margin-top: 0px;
margin-bottom: 30px;
border-top: 1px solid #000;
line-height:12px;
color: #999;
background-color: #2E3233;
padding: 5px;
}#commentsformheader{
padding-left:18px;
font-size: 1.4em;
color:#FF9900
}#commentsform{
margin-top:0;
text-align:center;
padding:0px 10px;
}#commentsform form{
text-align:left;
margin:0px;
}#commentsform p{
margin:5px;
}#commentsform form textarea{
width:99%;
}
p.comments_link img{
margin: 0px;
padding: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#lightbox{
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}#imageContainer{
padding: 10px;
}#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%
}#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; }#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
}
#dolphinnav padding değeri ile oynayın..
Olmadı header oda olmassa #dolphincontaine ile oynayın..
#dolphin 'ler men klasorunun içinde.
js menunun style.css i asagidaki gibi.. neresi degisecek. bir kac deneme yapmama ragmen beceremedim.
#dolphincontainer{position:relative;border-bottom: 2px solid navy; color:#E0E0E0;background:#343839;
width:100%;font-family:Helvetica,Arial,Verdana,sans-serif;}
#dolphinnav{position:relative;height:33px;font-size:12px;text-transform:uppercase;font-weight:bold;background:#fff url(images/dolphin_bg.gif) repeat-x bottom left;padding:0 0 0 20px;}
#dolphinnav ul{margin:0;padding:0;list-style-type:none;width:auto;float:left;}
#dolphinnav ul li{display:block;float:left;margin:0 1px;}
#dolphinnav ul li a{display:block;float:left;color:#EAF3F8;text-decoration:none;padding:0 0 0 20px;height:33px;}
#dolphinnav ul li a span{padding:12px 20px 0 0;height:21px;float:left;}
#dolphinnav ul li a:hover{color:#fff;background:transparent url(images/dolphin_bg-OVER.gif) repeat-x bottom left;}
#dolphinnav ul li a:hover span{display:block;width:auto;cursor:pointer;}
#dolphinnav ul li a.current,#dolphinnav ul li a.current:hover{color:#fff;background:#1D6893 url(images/dolphin_left-ON.gif) no-repeat top left;line-height:275%;}
#dolphinnav ul li a.current span{display:block;padding:0 20px 0 0;width:auto;background:#1D6893 url(images/dolphin_right-ON.gif) no-repeat top right;height:33px;}#dolphin_inner{color: white; padding: 5px; font-size: 80%; height: 1em}
#dolphin_inner a:link, #dolphin_inner a:visited, #dolphin_inner a:active{color: white}
#dolphin_inner a:hover{color: yellow}.innercontent{display: none;}
kardeşim header.gif i arkaplan resmi olarak kullanma.onu degiştir normal aynı boyuntunda normal resim olarak sayfana yerlestir ozaman sorunun duzelecektir ;)
teknoloji1, iyi diyorsun da onu nasıl yapacagım ki ? yardımcı olabilir misin ?
header.php den koyacaksın sonra sytle.css den mevcut olan arka planı silceksin ! ;)
teknoloji1, dedigin gibi yaptım ama o zamanda sitenin dısında kalıyor banner. bi acaip goruntu oluyor..
tema nin ıcınde resmin boyutlarına gore entegre edemez miyiz bunu ? ? ? bu kadar zor mu yaf bu. ben bilmiyorum diye zor orası tamam da :)
yardımlarınızı bekliyorum.
tesekkurler simdiden.
#dolphinnav padding değeri ile oynayın..
Olmadı header oda olmassa #dolphincontaine ile oynayın..#dolphin 'ler men klasorunun içindeki css'de
header ise temanızın css 'nin içinde.
diye tekrar ediyorum...
sorununuz hala devam ediyor sanırım. neden çözülmüş olarak işaretlediniz.
eylultoprak, ustad yardımcı olmaya calisiyorsun farkındayım ama maalesef o degerlerle oyunasamda basarılı olamadım. o yuzden yukarı css leride koymustum. biraz acemiyim css ve bu konularda.
aligon, hayır ben isaretlemedim cozulmus olarak :(
sorunum halen devam ediyor.. :(
resmi küçültmeyi deneyin o zaman .
http://www.resim-yukle.com/img01/14/465767header.gif
bu resmi yükleyip bir bakarmısınız. (resmin boyutunu değiştirmedim. sadece alttan 10px'lik kısmı silip, transparan yaptım :)
aligon,
fotografı kucultmek isin kolay tarafı. :) yuksekligini dusururum hallolur problem ama her fotografı degistirmek istedigimde ayarlamak zorunda kalacagim yuksekligini.
ben fotografı kucultmektense o alanı fotografa gore ayarlamak istiyorum.
verdigin fotografıda denedim ama hicbir degisiklik yok dogal olarak.
baska onerin var mı ?
değişiklik olması gerekir, çünkü dediğim gibi resmin altındaki 10 px'lik kısmı transparan yaptığım için, resmin altta bitim yeri ile menülerin bitim yeri eşitleniyor. çerezleri temizleyip bi daha bakın isterseniz :) (ben resmin boyutunu değiştirmedim bu arada)
(an itibariyle güzel gözüküyo bence)
aligon, benanlatamadım sanırım. dedigin sekilde transparan yapmadan da style.css dosyasında ki header in yuksekligini ayarlayarak bunu yapabiliyoruz. ama resminaltını kaybediyoruz.
su anda siteden bakabilirsin durumunu.
yardımcı olmaya calistigin icin tesekkur ederim
adım hıdır, elimden gelen budur :)
arkadaslar sorun cozulmustur.
nasil mı ?
<br>
<br>
<br>
3 satır header.php ye ekleyince olay cozuldu :))
bu kadar bastimis yani.
yardımcı olan olamayan tum arkadaslara tesekkurler
Mesaj göndermek için giriş yapmalısınız.
