Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Aug 2012
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Question Need To Find CSS For Web Page Element

    Trying to find the CSS script that controls the size & location of the blue/silver Search box underneath the "WP Local Places" logo. In Firefox, hovering the mouse pointer in a corner of the blue box & right-clicking then left-clicking "Inspect Element" identifies the box as "div#main-search". To see the code, click "Tools/Web Developer/Style Editor" in Firefox.

    My knowledge of CSS is basic & I have spent hours trying to solve this, appreciate some help.

    Site: http://www.hirestreet.co.uk/

  • #2
    New to the CF scene
    Join Date
    Aug 2012
    Location
    Haryana
    Posts
    4
    Thanks
    0
    Thanked 1 Time in 1 Post

    Use Chrome Inspecting Feature

    Well if you are using Chrome just right on your element and on the right hand side you can click on the CSS styles link which will display all the styles contained in that element
    Last edited by VIPStephan; 08-18-2012 at 10:50 AM. Reason: removed ad link

  • Users who have thanked RJCreationzzz for this post:

    dynamata (08-13-2012)

  • #3
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    3,763
    Thanks
    23
    Thanked 548 Times in 547 Posts
    The style sheet is located here: http://www.hirestreet.co.uk/wp-conte...aces/style.css

    The div your looking for is labeled <div class="row">
    .row {

    width: 100%;

    max-width: 970px;

    min-width: 755px;

    margin: 0 auto;

    }

    Your not going to get the full size. The height is dependent on content and it's positioned by normal flow.

  • Users who have thanked sunfighter for this post:

    dynamata (08-13-2012)

  • #4
    New to the CF scene
    Join Date
    Aug 2012
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thank's for the input, Chrome's "Inspect Element" identifies each element. The Search bar is too big so I originally wanted to reduce it to a box & re-locate in the right column, leaving the silver Menu bar "<div class="hmenu rounded">_</div>" in place as it has links (unless I could stack links vertically). I would settle for reducing the Search bar height & moving it down, leaving enough space above for a graphic & logo.

    I had managed to reduce the Search bar width:

    .row {

    width: 100%; /* here */

    max-width: 970px;

    min-width: 755px; /* here */

    margin: 0 auto;

    }

    when I reduced the text-entry height:

    #main-search .h39 {

    height:40px; /* 20px */

    }

    the bottom half of the field is cut off along with the rounded corners, doesn't happen when reducing Search bar width. I know enough CSS to know I don't know enough CSS, the ability to modify the Search bar should have been part of the theme.

  • #5
    New to the CF scene
    Join Date
    Aug 2012
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I made enough space to insert the header image by editing this line:

    .header_in { width:960px; margin:0 auto; padding:5px 0 25px 0;} /* 0 150px 0 */

    curiously after adding the text logo, the Search box moved up over the bottom of the image? & the space had to be increased to push it back down again.

    Site: http://www.hirestreet.co.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •