Logo, Social Share Icons, and Tag line

  • I will greatly appreciate any help in aligning the Logo, Social ‘Share’ Icons, and Tag line all in a single line.

    Here is what I have done so far:

    I have created the widget areas 1) After the header 2) After the Navbar, and 3) after the logo.
    I have removed/hide the ‘bavbar’ using the following:

    .navbar,
    .navbar .navbar-inner,
    .navbar .nav {
    webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    background: none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    }

    Now, I would like to put the social ‘share’ icons/links (using a plugin) in the “after the logo widget area”, or whatever.

    When I do it, all the icons break up and show in a vertical line under the logo.

    Obviously, I need to extend the ‘span’ of the logo and reduce the span of others (navebar/tagline).

    Someone was suggesting using the css:

    .row-fluid .span3
    .navbar-wrapper .brand {width:70%; float:left;}
    .navbar-wrapper .navbar {width:30%; float:right}

    To me, this css doesn’t seems right. didn’t work.

    Most obviously, I will need to change the settings of the respective spans of these elements in the the ‘functions.php’ (child theme).

    The site is: https://newsscouter.com/

    Please check the site. Once done, Site Logo, Social Icon bar, and the Tagline all will be on a single line.

    Thank you very much for any help and advice

Viewing 2 replies - 1 through 2 (of 2 total)

  • Did you fix this? I’m seeing this which seems OK. But I’m using a 1920px wide monitor.
    Your header starts going awry at 980px wide.

    So not sure if you’ve fully explained the problem?

    Thread Starter Parwaiz Khan

    (@parwaiz-khan)

    rdellconsulting,

    Thank you very much for looking into it. Yes, after many tries, I was able to create a widget area ‘in’ the navbar, which allowed me to put the social share icons in there.

    The header on my screens (smart phones, 1366px, and 1440px sizes) seems OK. But, you said it goes ‘awry’ at 980px – what you meant by that?

    Bedside that, you may have noticed that though the site expands all the way to 1440px, the image ‘after_header’ (blue sky stripe) doesn’t expand to the full width (I did try the full 1440px size).

    Can you give me some idea as to what the issue is with the header, and if there is a way to make the image ‘after_header’ fully responsive.

    I really appreciate it very much that you took time to look into it.

    What you think about the site – any ideas for improvements?

    [the site has 3 columns – each with a ‘span-4’ width. Is there a way to insert a ‘border’ or stripe separating the columns?]

    Thank you again.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Logo, Social Share Icons, and Tag line’ is closed to new replies.