WordPress.org

Ready to get started?Download WordPress

Forums

Mantra
[resolved] Two Image on the Header (6 posts)

  1. stefanohouse
    Member
    Posted 1 year ago #

    Hi, i would like to ask you if it is possible to have two image on the header, one one the left and one on the right.
    I don't know how to put the second image on the right of the header.

    Thank you!

  2. CraXeliCroX
    Member
    Posted 1 year ago #

    @Stefanohouse
    I would probably mix the 2 pictures in Adobe Photoshop and save them on one single image file that I would use as a header or featured image. That would give you many options as to how you can mix the 2 pictures, only limited by your imagination.
    But if your idea is that the 2 pictures should link to 2 different locations then I am not aware of a solution to that specific issue.

  3. stefanohouse
    Member
    Posted 1 year ago #

    Hi CraXeliCroX, thank you for your suggestion. I have actually done so, even if i was searching a way to do this with a html code, but it's okay so.
    Thank you!

  4. JR
    Member
    Posted 1 year ago #

    if you have the for example the

    <div id="header">
    <div class="left-header"></div>
    <div class="right-header"></div>
    </div>

    #header{
       width: 1000px;
       height: 200px;
       margin: 0 auto;
       position: relative
    }
    
    .left-header{
      width: 500px;
      height: 200px;
      float: left;
      background-image: url('images/left-picture.png');
      background-repeat: no-repeat;
      margin: 0;
      padding: 0;
    }
    
    .right-header{
      width: 500px;
      height: 200px;
      float: left;
      background-image: url('images/right-picture.png');
      background-repeat: no-repeat;
      margin: 0;
      padding: 0;
    }

    : )

  5. stefanohouse
    Member
    Posted 1 year ago #

    Thank you so much JR.

    Have a nice week end!

  6. CryoutCreations
    Member
    Theme Author

    Posted 1 year ago #

    Since version 2.0 you can have a header background image and a logo image over it.
    So you can use the header image for the right part and the logo for the left part. But you'll need to remove some padding/margin from a#logo to make it fit the whole area if needed.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags