2 Replies - 715 Views - Last Post: 03 September 2012 - 11:51 PM

#1 simontech  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 1
  • Joined: 30-August 12

Help bolding a menu item in HTML

Posted 30 August 2012 - 09:31 AM

Hello, I have a website and I need to bold the contact us menue item in navigation menue. How do I go about this? The code I have is below

 3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{
    margin:0;
    padding:0;
}
ul{
    list-style:none;
}
fieldset{
    border:0;
}
a img{
    border:0;
}
.clear{
    clear:both;
}


body {
    background: #f3e9c8 url(bodybg.jpg) top center no-repeat;
    font-family: Georgia, arial, sans-serif;
    font-size:12px;
    color:#666666;
    height: 100%;
    margin:0;
    padding:0;
}

a{
    color: #767d49;
    text-decoration: none;
}
p {
    font-family: Tahoma;
    line-height: 170%;
    color: #403b34;
    font-size: 13px;
    padding: 5px 0px 5px 0px;
}
h1 {
    font-size:30px;
    color:#403b34;
    font-weight: normal;
    line-height:1.5;
    padding: 5px 0px 5px 0px;
}
h2 {
    font-size:24px;
    color:#403b34;
    font-weight: normal;
    line-height:1.5;
    padding: 5px 0px 5px 0px;
}

#wrapper {
    width:996px;
    margin: 0px auto;
}

.title{
    width: 949px;
    padding: 13px 0px 0px 0px;
    margin: 0px 0px 0px 30px;
    font-size: 30px;
    height: 51px;
    text-align: center;
}

.title, .title a {
    color: #2a310e;
}

.title span.titletext{
    position: relative;
    display: inline-block;
    margin: 0 auto;
    padding: 5px 0px 20px 44px;
    min-height: 20px;
    _height: 20px;
    background: url(titlebg.png) left top no-repeat;
    _background: none;
    _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='files/theme/titlebg.png', sizingMethod='crop');
}


#navigation{
    position: relative;
    list-style: none;
    width: 875px;
    height: 22px;
    z-index: 2;
    text-align: center;
    margin: 0px 0px 0px 55px;
    padding: 12px 0px 0px 0px;
}

#navigation li{
    display: inline;
    z-index: 2;
    padding: 0px 2px 0px 0px;
    background: url(navigationli.gif) right top no-repeat;
}

#navigation li a{
    display: inline-block;
    color: #6e7641;
    z-index: 2;
    padding: 0px 10px 0px 8px;
    font-size: 16px;
}

#navigation ul li a:hover, #navigation ul li#active a{
    color: #348017;
}

#header{
    position: relative;
    width: 945px;
    height: 303px;
    z-index: 1;
    padding: 46px 0px 0px 50px;
    margin: 31px 0px 0px 0px;
    background: url(headerbg.png) no-repeat;
    _background: none;
    _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='files/theme/headerbg.png', sizingMethod='crop');
}

.weebly_header{
    width: 895px;
    height: 253px;
    background: url(%%HEADERIMG%%) no-repeat;
}

#weebly-menus .weebly-menu-wrap { z-index: 5000;  margin: 5px 0px 0px 0px;}
 #weebly-menus .weebly-menu { padding: 0; margin: 0; list-style: none; }
 #weebly-menus .weebly-menu li { float: left; clear: left; width: 168px; text-align: left; }
 #weebly-menus .weebly-menu li a { position: relative; display: block; width: 150px; background: #5f6734; border-top:  none; border-bottom: 1px solid #d2c3a2; border-right: none; border-left: none; text-decoration: none; font-size: 13px; font-weight: normal; line-height:1; padding: 8px 6px 8px 12px; color: #fff; }
 #weebly-menus .weebly-menu li a:hover { background: #727a45; color: #d2c3a2; }

#content{
    width: 884px;
    min-height:400px;
    _height:400px;
    padding: 0px 38px 10px 38px;
}

#footer{
    width: 924px;
    color: #403b34;
    font-size: 13px;
    margin: 0 auto;
    background: url(footerbg.jpg) top no-repeat;
    text-align: left;
    padding: 50px 14px 30px 14px;
    margin: 0px 0px 20px 19px;
} 
for the main-style.css and then

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>{title}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body class="wsite-theme-light">
    <div id="wrapper">
      <div class="title"><span class="titletext">{logo max-height="35"}</span></div>
            
            <div id="navigation">
                {menu}
            </div>
    
        <div id="header"><div class="wsite-header"></div></div>
            
            <div id="content">
                {content}
            </div>
                <div id="footer">
                    {footer}
                </div>
    </div> 
</body>
</html>
    


for the index.html

Please help!!!

Is This A Good Question/Topic? 0
  • +

Replies To: Help bolding a menu item in HTML

#2 BenignDesign  Icon User is offline

  • holy shitin shishkebobs
  • member icon




Reputation: 6018
  • View blog
  • Posts: 10,444
  • Joined: 28-September 07

Re: Help bolding a menu item in HTML

Posted 30 August 2012 - 09:56 AM

Add this:

font-weight:bold;



to your navigation CSS.
Was This Post Helpful? 2
  • +
  • -

#3 James_Smith  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 20-July 12

Re: Help bolding a menu item in HTML

Posted 03 September 2012 - 11:51 PM

Hi Simontech,

I am agree with BenignDesign. You have to add
font-weight:bold;
to your navigation css, till if you have any problem with this - ask again.
Was This Post Helpful? -1
  • +
  • -

Page 1 of 1