Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member
    Join Date
    Jun 2012
    Posts
    3
    Member #
    32074
    So for this website I am working on has an image boarder, and it is my navigation bar on the site, even though it has the webkit for firefox and Opera it is only working in Safari. I can not get it to work so if anyone could help me out and tell me why its not working that would be greatly appreciated. Below is the HTML and CSS.

    Here is the HTML

    HTML Code:
    <!DOCTYPE html>
    <head>
     
    <title>Mama Cakes</title>
    
    <link rel="stylesheet" type="text/css" href="style.css" />
     
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/infiniteCarousel/jquery.infinitecarousel.js"></script>
    <script type="text/javascript">
    $(function(){
        $('#carousel').infiniteCarousel();
    });
    </script>
       
    </head>
    
    <body>
    
    <div id= "container">
    <center>
    
    <div id="topbar">
    
    </div>
       
    <div id= "headerimg">
    
    <img src="http://img.photobucket.com/albums/v134/Invadergir1612/Logo.png" />
     
    <div id= "header">
    
    <h1>Cupcakes Make Everything Better</h1>
    
    </div>
    
    </div>
      
    <div id="head">
    
    </div>
        
    <div id= "navbar">
    <a href="news.html">News</a>
    <a href="menu.html">Menu</a>
    <a href="flavors.html">Our Flavors</a>
    <a href="gallery.html">Photo Gallery</a>
    <a href="videos.html">Our Video's</a>
    <a href="community.html">Community</a>
    <a href="visit.html">Visit Us</a>
    <a href="testimony.html">Testimonials</a>
    <a href="contact.html">Contact Us</a>
    
    </div>
      
    <div id="carousel" >
    <ul>
        <li><img alt="" src="images/Carousel_image.png" width="800" height="250" /><p>This carousel has no padding applied to it so you won't see hints for the previous and next images. Also, the progress bar could be disabled by setting just one option on the plugin.</p></li>
        <li><img alt="" src="images/Carousel3.jpg" width="800" height="250" /><p>This is the caption for the second image. The height of the caption box is an option.</p></li>
        <li><img alt="" src="images/Carousel2.jpg" width="800" height="250" /></li>
     
    </ul>
    </div>
     
    <div id= "content">
    
    <h1>Welcome To Mama Cakes</h1>
    <p>
    Mama cakes is a family owned and family run cupcake bakery. All of our cupcakes are baked fresh from scratch using the finest ingredients. our display case is filled daily with a large variety of cupcakes. Along with delicious cupcakes we also have custom cupcakes, custom cakes, cake pops, and gran-val scoop ice cream. Our flavors range from simply delicious vanilla dream to sinfully delicious death by chocolate . We also have our cocktail inspired cupcakes that include the Paddy and margarita. Every first Monday of the month we introduce the wacky flavor of the month and our flavor list is always growing. So whether your in the mood for something traditional or something different Mama Cakes has what your looking for.
    </p>
    </div>
      
    <div id= "bottomcontent">
     
    <div id= "Facetwit">
    
    <a href="https://www.facebook.com/pages/Mama-Cakes/188302341183750">
    <img border="0" src="http://img.photobucket.com/albums/v134/Invadergir1612/facebookicon2.png" alt="Facebook Link"></a>
    
    <a href="https://twitter.com/visitmamacakes">
    <img border="0" src="http://img.photobucket.com/albums/v134/Invadergir1612/twittericon.png" alt="Twitter Link"></a>
    
    <div id= "Facetwitbottom">
    
    Follow us on Facebook and Twitter
    
    </div>
    </div>
     
    <div id= "Visit">
    
    <a href="visit.html">Visit Us</a>
     
    <div id= "Visitbottom">
    
    Want To Visit Us? Click the link above for directions.
    
    </div>
    
    </div>
     
    <div id= "Contact">
    
    <a href="contact.html">Contact Us</a>
     
    <div id= "contactbottom">
    
    Click here to contact us
    
    </div>
    
    </div>
    
    </div>
      
    <div id= "footer">
    
    &copy; Mama Cakes 2012
    
    </div>
     
    </center>
    </div>
           
    </body>
    Here is the CSS

    Code:
    body
    
        {background-image:url('http://img.photobucket.com/albums/v134/Invadergir1612/Dotsbg.jpg');
        margin: 0;
        Padding: 0;
        }
    
    #container
        {
        margin: 0 auto;
    
        }
     
    #topbar
        {
        background-color: #efcfe0;
        width: 100%;
        height: 15px;
    
        }
      
    #headerimg img
        {
        float: left;
        padding-top: 10px;
    
        }
    
    #headerimg
        {
        width: 680px;
        margin: auto;
     
        }
     
    #header h1
        {
    
        float: left;
        margin-top: 80px;
    
        }
     
    #head
        {
    
        background-color: #faf2f6;
        width: 100%;
        height: 200px;
        padding: 0px;
    
        }
      
    #navbar
        {
        border-width:1px 0px 10px 0px;
        padding:15px 0px;
        -moz-border-image: url("http://img.photobucket.com/albums/v134/Invadergir1612/navbar2.png") 0 14 0 14 stretch; /* Firefox */
        -webkit-border-image: url("http://img.photobucket.com/albums/v134/Invadergir1612/navbar2.png") 0 14 0 14 stretch; /* Safari */
        -o-border-image: url("http://img.photobucket.com/albums/v134/Invadergir1612/navbar2.png") 0 14 0 14 stretch; /* Opera */
        border-image: url("http://img.photobucket.com/albums/v134/Invadergir1612/navbar2.png") 0 14 0 14 stretch;
        clear: both;
    
        }
     
    a:link
        {
        color:#FFFFFF;
        text-shadow: 2px 2px #000000;
        text-decoration: none;
        padding: 10px;
        font-family:"Georgia";
    
        font-size: 20px;
    
        }
     
    a:visited
        {
        color:#FFFFFF;
        }
     
    a:hover
        {
        color:#666;
        text-shadow: 0px 0px #000000;
    
        }
     
    /*#carousel
        {
        position: absolute;
        left: 350px;
        top: 100px;
        }
    */
     
    #carousel ul {
        list-style: none;
        width:1600px;
        margin: 0;
        padding: 0;
        position:relative;
    }
    #carousel li {
        display:inline;
        float:left;
    }
      
    #content
        {
        background-color: white;
        padding: 10px;
        margin: 20px;
        box-shadow: 5px 5px 5px #888888;
        width: 90%;
    
        }
     
    #content br
        {
        width: 400px;
    
        }
      
    #bottomcontent
        {
    
        width: 810px;
        margin: 0 auto;
    
        }
       
    #Facetwit
        {
        background-color: white;
        padding-top: 10px;
        margin: 10px;
        width: 250px;
        height: 150px;
        box-shadow: 5px 5px 5px #888888;
        float: left;
    
        }
     
    #Facetwitbottom
        {
        background-color: #b8b8b8;
        height: 58px;
        width: 230px;
        Padding: 10px;
        color: #000;
        float: left;
    
        }
       
    #Visit
        {
        background-color: white;
        padding-top: 10px;
        margin: 10px;
        width: 250px;
        height: 150px;
        box-shadow: 5px 5px 5px #888888;
        float: left;
     
        }
       
    #Visitbottom
        {
        background-color: #b8b8b8;
        height: 75px;
        width: 230px;
        Padding: 10px;
        color: #000;
        float: left;
    
        }
    
    #Visit a
        {
        font-size: 50px;
        text-decoration: none;
        color: #000000;
        font-style: none;
        text-shadow: 0px 0px #000000;
        }
     
    #Contact
        {
        background-color: white;
        padding-top: 10px;
        margin: 10px;
        width: 250px;
        height: 150px;
        box-shadow: 5px 5px 5px #888888;
        float: left;
    
        }
      
    #contactbottom
        {
        background-color: #b8b8b8;
        height: 80px;
        width: 230px;
        Padding: 10px;
        margin: 0px;
        color: #000;
        float: left;
    
        }
    
    #Contact a
        {
        font-size: 45px;
        text-decoration: none;
        color: #000000;
        font-style: none;
        text-shadow: 0px 0px #000000;
    
        }
     
    #content td a
        {
        padding: 0px;
        }
    
    #content td
        {
        padding: 10px;
        }
     
    #footer
        {
        background-color: white;
        padding: 10px;
        margin: 20px;
        box-shadow: 5px 5px 5px #888888;
        text-align: center;
        clear: both;
        }
     
    #footer2
        {
        background-color: white;
        padding: 10px;
        margin: 20px;
        box-shadow: 5px 5px 5px #888888;
        text-align: center
     
        }
     
    #content a
        {
        color: black;
        text-decoration: none;
        font-style: inherit;
        font-size: 15px;
        font-family:"Georgia";
        text-shadow: 0px 0px #000000;
    
        }
        
    @media only screen and (max-width: 810px)
        {
    
        #headerimg
            {
        width: 100%;
    
            }
      
        #header h1
            {
    
        float: left;
        margin-top: 0px;
    
            }
    
        #headerimg img
            {
        margin: auto;
        padding-left: 100px;
    
            }
      
        #head
        {
    
        background-color: #faf2f6;
        width: 100%;
        height: 300px;
    
        }
      
        #bottomcontent
        {
    
        width: auto;
    
        }
       
        #Facetwit
            {
            background-color: white;
            padding-top: 10px;
            margin: 10px auto;
            width: 250px;
            height: 150px;
            box-shadow: 5px 5px 5px #888888;
            float: none;
    
            }
     
    #Facetwitbottom
        {
        background-color: #b8b8b8;
        height: 48px;
        Padding: 10px;
        color: #000;
        float: none;
        margin: 10px auto;
    
        }
       
    #Visit
        {
        background-color: white;
        padding-top: 10px;
        margin: 10px auto;
        width: 250px;
        height: 150px;
        box-shadow: 5px 5px 5px #888888;
        float: none;
      
        }
       
    #Visitbottom
        {
        background-color: #b8b8b8;
        height: 63px;
        Padding: 10px;
        color: #000;
        float: none;
        margin: 10px auto;
    
        }
     
    #Contact
        {
        background-color: white;
        padding-top: 10px;
        margin: 10px auto;
        width: 250px;
        height: 150px;
        box-shadow: 5px 5px 5px #888888;
        float: none;
    
        }
      
    #contactbottom
        {
        background-color: #b8b8b8;
        width: 230px;
        height: 70px;
        Padding: 10px;
        color: #000;
        float: none;
        margin: 10px auto;
     
        }
       
    #carousel
        {
        display: none;
        }
    
        }

  2.  

  3. #2
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    img {border: none;}

    Add that to your CSS and see if it solves your problem (although I can't tell if you want the border or not.)
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:44 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com