www.webdeveloper.com
Results 1 to 6 of 6

Thread: Image Question

  1. #1
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900

    Image Question

    Hello,

    On this site http://djshawnmichaels.com/testmenu/

    Look for the features button, I want to add a graphic after the word features, but part of the same button.

    This is the line of code for the feature button:
    <li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')">Features</a></li>

    How would I go about doing this?

    Thank you kindly
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    You can add it as the background-image for your link:
    Code:
    <li>
    <a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
    Features
    </a>
    </li>
    The button looks pretty small - you may have to change some of the spacing.
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  3. #3
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900
    Thanks, that helped It took out my divider by me adding that in there, so with having this
    <li>
    <a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
    Features
    </a>
    </li>

    Is there a way to add another image right after my arrow?

    Thanks
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  4. #4
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    How do you have the dividers inserted for the other links? Is it part of the background image? If so, all you need to do is adjust the padding/widths for that button and some of the neighboring buttons so that it reappears.
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  5. #5
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900
    I played with the padding, and the same thing happens with no dividor bar. In my css for the menu, this is the code for the divider bar:

    #chromemenu ul li a{
    float: left;
    color: #AA1111;
    font-weight: bold;
    padding: 6px 11px 6px 11px;
    text-decoration: none;
    background: url(divider.gif) center right no-repeat; /*Theme Change here*/
    }

    So would there be a way that I could add the divider manually?

    Thanks
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  6. #6
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    You might try:
    Code:
    <li>
    <a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')" style="background: url(file.gif) no-repeat right;">
    Features
    </a>
    <span style="background: url(divider.gif) no-repeat; width: 2px;"></span>
    </li>
    Last edited by KDLA; 05-18-2006 at 03:15 PM. Reason: deleted too much
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles