Note that there are some explanatory texts on larger screens.

plurals
  1. POSearch Bar won't work in Safari?
    primarykey
    data
    text
    <p>Ok, I'm not sure what to do. I have this search bar issue. My site is kissoff.weebly.com and the site works in IE, Chrome, Firefox, Opera, Seamonkey-- but it's not safari-compatible due to the search bar.</p> <p>I need to push the search bar over to the right, just like how it should look in IE, Chrome, Firefox, Opera. Here's a screenshot of the site in Safari: <a href="http://files.andrewjudd.ca/kiss-off-search.png" rel="nofollow">http://files.andrewjudd.ca/kiss-off-search.png</a></p> <p>Darn Safari. Any ideas? I'll share my search bar and navigation bar's css &amp; html, but I'd really appreciate anyone checking the full css/html of my website.</p> <pre><code> #navigation { position: fixed; margin-top: 0; left: 0; top: 0; right: 0; width: 100%; color: #ffffff; height: 35px; text-align: center; padding-top: 15px; /* Adds shadow to the bottom of the bar */ -webkit-box-shadow: 0px 0px 8px 0px #000000; -moz-box-shadow: 0px 0px 8px 0px #000000; box-shadow: 0px 0px 8px 0px #000000; /* Adds the transparent background */ background-color: rgba(125, 180, 18, 0.8); color: rgba(1, 1, 1, 0.8); z-index: 900; } #search { display: inline; } #search input[type="text"] { display: inline; background: url(search-white.png) no-repeat 10px 6px #fcfcfc; border: 1px solid #d1d1d1; position: fixed; margin-left: 450px; margin-right: 0px; margin-top: 0px; color: #bebebe; width: 150px; padding: 6px 15px 6px 35px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset; -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset; -webkit-transition: all 0.7s ease 0s; -moz-transition: all 0.7s ease 0s; -o-transition: all 0.7s ease 0s; transition: all 0.7s ease 0s; } #search input[type="text"]:focus { width: 200px; margin-right: 200px; -o-margin-right: 10px; display: inline; } /*SNIPPET OF HTML FOR NAVIGATION BAR &amp; SEARCH HERE:*/ &lt;div id="navigation"&gt; &lt;div id="title"&gt; KISS OFF &lt;/div&gt; &lt;form method="get" action="/search" id="search"&gt; &lt;input name="q" type="text" size="40" placeholder="Search..." /&gt; &lt;/form&gt; &lt;a href="#"&gt;Home&lt;/a&gt; &lt;a href="#"&gt;Login&lt;/a&gt; &lt;a href="#"&gt;Register&lt;/a&gt; &lt;a href=#terms&gt;Terms&lt;/a&gt; &lt;/div&gt; </code></pre> <p>Thanks for looking, I appreciate it. :) --Dijji</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload