Inserting Search box into header image

[goalieman34]

I am looking to insert/move my search bar into my header image. (kinda similar to what http://www.bing.com/ does) I am looking to do this purely with CSS. It is a Squarespace 6 template and I have limited access to the sites Html.

Thanks for your time. Here is the link to my website http://www.jobspark.ca/

[mattrossi]

if you don’t have access to the html, you can absolutely position that search box up the page a bit with a negative value, but do this with caution.

[jmacaluso]

i think some jQuery could work. http://codepen.io/jmacaluso711/pen/EleJu

$(document).ready(function(){

$('#header').append($('.search'));

});

[jmacaluso]

and i just noticed you said you wanted to do it purely with css… my bad

[CrocoDillon]

If you can’t change the html you can do some ugly absolute positioning with some negative top.

[goalieman34]

@mattrossi @CrocoDillon @jmacaluso I found a spot that I can insert some html into my header. Does this help things ?

[mattrossi]

Um, it may or may not. You need to move that form, so if you have access to the markup / code for the form, you can maybe move it up into the header?

[Author]

Posts