Jump to content


Photo
- - - - -

Header Text Position


  • Please log in to reply
9 replies to this topic

#1 mooihoek

mooihoek

    Super Member

  • Members

  • 127 posts
  • Country: Country Flag

Posted 11 October 2012 - 12:25 PM

Hi can someone help me move the text ion the homepage near the search button to the left? I want to position the text between the last button and the search area all on one row

http://tinyurl.com/9krpfps

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 11 October 2012 - 02:29 PM

You’ll need to use Custom CSS (in Site Options > Custom Code > Custom CSS). CSS that changes the style of a page element consists of two parts: the selector and the attribute.

Selector: Used to select the page element you want to change (in this case, the page element you want to change is your text).
Attribute: Property that determines what kind of change you want (you’re changing the text position, so the attribute you want to use is the margin property).

To find the selector for the text, you'll need to use Firebug (or Chrome Development tools). To learn how to use Firebug for CSS customizations, please read and follow these instructions:

Please Login or Register to see this Hidden Content



For help with the margin attribute, please see these instructions:
http://www.w3schools.com/css/css_margin.asp

#3 mooihoek

mooihoek

    Super Member

  • Members

  • 127 posts
  • Country: Country Flag

Posted 12 October 2012 - 01:59 PM

thanks I found some code in the forums which I've used but the text wont stay on the same row, any ideas?

#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 12 October 2012 - 02:58 PM

You'll need to increase the width of the <DIV> layer the text is in so that it's wide enough to fit the entire line. The width attribute is:

Please Login or Register to see this Hidden Content


Replace # with the number of pixels.

#5 mooihoek

mooihoek

    Super Member

  • Members

  • 127 posts
  • Country: Country Flag

Posted 12 October 2012 - 04:34 PM

Ok I think the div layer is <div class="icons" style="bottom: -48px; right: px;"> is that right?

#6 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 12 October 2012 - 04:41 PM

What code are you using to add the text?

#7 mooihoek

mooihoek

    Super Member

  • Members

  • 127 posts
  • Country: Country Flag

Posted 12 October 2012 - 04:49 PM

Im using

add_action('pagelines_branding_icons_start', 'brand_phone');
function brand_phone(){ ?>
<h6 class="phoneRight">Tel 0203777546</h6>
<?php
}

If there a better and more simple way Im keen to find out!

#8 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 12 October 2012 - 04:59 PM

You should use a DIV layer instead of a heading tag:

Please Login or Register to see this Hidden Content


And then add this CSS to Custom CSS:

Please Login or Register to see this Hidden Content


Change # to the DIV layer width.

#9 mooihoek

mooihoek

    Super Member

  • Members

  • 127 posts
  • Country: Country Flag

Posted 12 October 2012 - 06:29 PM

thanks Catrina much appreciated

#10 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 12 October 2012 - 06:53 PM

Do you need further assistance with anything else or did the code work?