Creating 3 columns in header area

Home › Forums › Projects › Creating 3 columns in header area

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 17th, 2015 at 11:20 PM #3635
    Anonymous
    Inactive

    Bryan Sir
    I want to create 3 columns in header area of groundwork, WordPress. First column for contact no, second column for logo and third column for search box. I am attaching scratch, kindly see it and assist me. The code should be a responsive.
    Header
    Regards
    Parth Ranjan, New Delhi

    February 18th, 2015 at 6:53 PM #3638
    Bryan Hadaway
    Keymaster

    You’ll want to add the following HTML to your header.php or a child theme header.php:

    <div class="header-third header-third-1">
PHONE # HERE
</div>
<div class="header-third header-third-2">
LOGO CODE HERE
</div>
<div class="header-third header-third-3">
SEARCH CODE HERE
</div>

    You’ll then want to add the following CSS to your style.css or a child theme style.css:

    .header-third{width:31.3%;margin:1%;float:left}
.header-third-1{text-align:left}
.header-third-2{text-align:center}
.header-third-1{text-align:right}
    February 19th, 2015 at 8:13 AM #3639
    Anonymous
    Inactive

    Thank you Bryan Sir, for your best assistance and cordination..

    Regards
    Parth Ranjan, New Delhi

    February 19th, 2015 at 5:28 PM #3641
    Bryan Hadaway
    Keymaster

    You’re welcome.

    February 20th, 2015 at 10:42 AM #3642
    Anonymous
    Inactive

    Hello Sir

    My question is about circles with hover, as you described in previous topic “Horizontal menu customization in home page” and your reply was

    nav ul li a {
    background: none repeat scroll 0 0 #eee;
    border-radius: 50%;
    color: #777;
    display: block;
    float: left;
    font-family: “Raleway”,sans-serif;
    font-size: 100%;
    font-weight: 500;
    height: 120px;
    line-height: 120px;
    margin: 1%;
    padding: 0;
    text-align: center;
    width: 120px;
    }

    I had used this code and work perfectly well…

    Now I have a same issue with some customization kindly see the image below
    circle image

    I have tried sir but not working.. Is this possible with the using of css.

    Any suggestion kindly share with me.

    Regards
    Parth Ranjan, New Delhi

    February 20th, 2015 at 6:53 PM #3643
    Bryan Hadaway
    Keymaster

    Please start a separate topic for this and please share the URL and more details on what the issue is.

    Thank you.

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.