Trying to replace css border properties with an image, (twentythirteen child) (6 posts)

  1. tasetta
    Posted 1 year ago #

    on wwww.iconoclasticpress.com/draft where I'm working out a new wordpress site using a child of twenty-thirteen, I'm puzzling how to change those thin white lines around main menu navigation, end of articles, between article and footer.

    I want to change the borders to images that looks like a long line of ink (similar to what's above and below the masthead/site's name) to divide up the page sections.

    The files are oldLines2.png and oldLine1.png.

    I'm trying to figure out the proper path to use in CSS to the images
    for instance this:

    #article {border-image:URL("../../uploads/2013/12/oldLines2.png");}

    and variations of this isn't working. Where am I wrong?

  2. Pioneer Web Design
    Posted 1 year ago #

    Please review the link provided.

  3. tasetta
    Posted 1 year ago #

    OOps, one w too many. Try this.

  4. tasetta
    Posted 1 year ago #

    This is my page.php code,

    What I believe I'd like to do is insert the oneLine1.png image as a breaking line just before #main and then I think the twoLines2.png after the #content.

    Is it ok to insert regular html code (that I know a bit of) into php (that I don't know) files?

    'get_header(); ?>

    <div id="primary" class="site-content">
    <div id="content" role="main">

    <?php while ( have_posts() ) : the_post(); ?>
    <?php get_template_part( 'content', 'page' ); ?>
    <?php comments_template( '', true ); ?>
    <?php endwhile; // end of the loop. ?>

    </div><!-- #content -->
    </div><!-- #primary -->

    <?php get_sidebar(); ?>
    <?php get_footer(); ?>'

  5. tasetta
    Posted 1 year ago #

    Nevermind, I've finally figured out that inserting
    '<div><img src="wp-content/uploads/2013/12/oldLine1.png" width="100%" /> </div>' into page.php worked much better than trying achieve this via CSS.

  6. tasetta
    Posted 1 year ago #

    On further examination, this isn't actually working on all pages.

    the custom divider shows on the first page, but not on the products, gallery, blog, or contact pages. Looking at the page source, I can see that like the first page, the <div> I inserted are there, however for some reason it is not showing.

    I ended up customizing the header.php file, which where the menu is, and I'd think that ought to make it show up on every single page alongside the menu, not just the first one.

    Is this a z-index related issue? If so, which way do I go on it?

Topic Closed

This topic has been closed to new replies.

About this Topic