- This topic is empty.
-
AuthorPosts
-
December 21, 2010 at 10:23 am #31062
hellie
Memberwhat’s up guys
hope yall doing just fine,I’m facing a problem in CSS
and I couldn’t really sort it out.. here is a pic explainingI want only the selected area to be linked “Home”
any ideas?
December 21, 2010 at 10:43 am #69285ozee
MemberCan you provide any code that you are using so that we may help you better?
December 21, 2010 at 11:03 am #69287hellie
Memberwell, I couldn’t do it
so I sliced the navigation menu into 2 parts
http://178.77.181.44/css/games/
http://178.77.181.44/css/games/css/style.css
http://178.77.181.44/css/games/images/maybe u can link any tutorial for doing it..
thanks for concerning
December 21, 2010 at 12:44 pm #69290ozee
MemberIt sounds to me like you are wanting to make the navigation click area not touch the bottom of the navigation, is that right? You can create the text in another image or include the font with –
@font-face {
font-family: "Your typeface";
src: url("type/filename.eot");
src: local("☺"),
url("type/filename.woff") format("woff"),
url("type/filename.otf") format("opentype"),
url("type/filename.svg#filename") format("svg");
}
h1 {font-family: "Your typeface", Georgia, serif; }
After you can set a line-height and Margins to judge where and how to place it. Let me know if this helps, I was unable to find a tutorial on what you were asking specifically, however there are a lot of navigation tutorials on http://net.tutsplus.comDecember 22, 2010 at 1:25 pm #69177hellie
Memberhey ozee
man I’m trying the way u posted up there
it’s not working as wellbody {
margin:0 auto;
padding:0 auto;
background-color:#afafaf;
}
#container {
width:970px;
height:1000px;
background:white;
margin-left:140px;
border-right:1px solid gray;
border-left:1px solid gray;
}
#header {
width:970px;
height:251px;
background:url(images/header.png);
}
#logo {
width:263px;
height:219px;
background:url(images/logo.gif);
position:relative;
right:-210px;
top:30px;
}
#navbar {
width:970px;
height:74px;
background-color:black;
-moz-border-radius: 5px;
}
#my {
width:114px;
height:52px;
background:url(images/myi3lan.png);
display:block;
position:relative;
right:-22px;
top:6px;
}
#sell {
width:54px;
height:31px;
background:url(images/sell.png);
position:relative;
right:-164px;
top:-28px;
}
#com {
width:160px;
height:32px;
background:url(images/com.png);
position:relative;
right:-264px;
top:-62px;
padding:0;
margin:0;
}
#com:hover {
background:url(images/comhover.png);
}
#contact {
width:156px;
height:19px;
background:url(images/contact.png);
position:relative;
}
exercise
http://178.77.140.212/exer/
http://178.77.140.212/exer/style.cssDecember 22, 2010 at 2:10 pm #69139hellie
Memberthanks for your help man
all what I had to do is make the #a display:block;thanks again
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.