Weergegeven resultaten: 1 t/m 9 van 9

Discussie: Search box alignen

  1. #1
    Member
    Lid sinds
    24/01/09
    Locatie
    Limburg
    Berichten
    38
    iTrader
    0

    Search box alignen

    Hallo,

    Ik ben bezig met deze layout te basen, maar zat vast bij het search box stuk. Ik weet namelijk niet hoe ik dat kan oplossen (heb ook niet veel verstand van CSS/HTML).

    Dit is wat ik tot nu toe gedaan heb:
    Photoshop-leren.be

    HTML:
    HTML-code:
    <!--Start Header--> 
    <div id="header_wrap"> 
    <div id="header"> 
    <a href="#"><img id="logo" src="images/logo.jpg" alt="logo" height="128" width="444" ></a> 
      <div class="hide"> 
        <h1>Blogname</h1> 
        <h2>Blog Descrition</h2> 
      </div> 
    <!--Search--> 
          <div id="search_wrap"> 
    	  	<form id="searchform" method="get" action="http://www.themeforest.net"> 
    				<fieldset> 
    					<input type="text" name="s" id="s" size="10" /><br /> 
    					<input type="submit" value="Go" id="button" /> 
    				</fieldset> 
    			</form> 
          </div> 
    </div> 
    </div> 
    <!--End Header-->
    CSS:
    HTML-code:
    /*HEADER*/
    
    #header {
    	margin: 0;
    	padding: 0;
    	background:url(images/logo.jpg) no-repeat;
    	height: 128px;
    	width: 444px;
    	position: relative;
    }
    
    /*
    -Search-
    */
    
    
    
    #search_wrap {
    	top: 20px;
    	right: 0;
    	position: absolute;
    }
    
    #s {
    	background: #676767;
    	border: 1px solid #8a8a8a;
    	padding: 5px 10px 6px 6px;
    	font-size: 13px;
    	color: #cacaca;
    	width: 180px;
    	font-family: Tahoma, Arial, Helvetica, sans-serif;
    }
    #button {
    	position: absolute;
    	top: -2px;
    	right: -23px;
    	height: 43px;
    	width: 43px;
    	background: url(images/search.png) no-repeat 0 0;
    	text-indent: -9999px;
    	cursor: pointer;
    }
    

    Ik heb al hard gezocht, maar ik kan het probleem maar niet vinden!

    Alvast bedankt,
    Saro Verhees

  2. #2
    Member
    Lid sinds
    24/12/08
    Locatie
    Hasselt
    Berichten
    17
    iTrader
    0
    Als ik de width van je header op 100% zet staat het zoekveld tegen de rechterkant..

  3. #3
    Member
    Lid sinds
    6/12/07
    Locatie
    Hoogstraten
    Berichten
    865
    iTrader
    0
    Wat ik altijd doe als er iets niet lukt is er een border rond plaatsen:

    border: 1px solid red;

    Ik vermoed dat het iets te maken heeft met het feit dat je right:0; hebt staan terwijl het right: 0px; moet zijn. Of je kan ook een float: right; meegeven.

  4. #4
    Member
    Lid sinds
    24/01/09
    Locatie
    Limburg
    Berichten
    38
    iTrader
    0
    @XiroN19: Heel erg bedankt!

    Als iemand tijd/zin heeft om me duidelijk te maken waarom, zou dat fijn zijn ^^

  5. #5
    Member
    Lid sinds
    24/12/08
    Locatie
    Hasselt
    Berichten
    17
    iTrader
    0
    euhm dat is zo omdat je header (dus waar je zoekbalkje inzit) maar een width had van 444px dus kon je zoekbalk niet verder naar rechts gaan dan de lijn die er getrokken was op 444px

    en idd ik heb het gevonden door rond die header-div en border te zetten werkt heel goed als je probleempje hebt hoe je niet te gokken waar je border van de div eventueel zou kunnen uitkomen :P

  6. #6
    Approved 9-lifer koebeest's schermafbeelding
    Lid sinds
    14/11/04
    Locatie
    Oudenaarde
    Berichten
    6.924
    iTrader
    5 (100%)
    Basen is zowat het domste woord dat ik ooit al hoorde. Wie daar mee afkwam :/ zucht... slicen ok... basen ... nee toch niet
    If you run, you'll only go to jail tired

  7. #7
    Member
    Lid sinds
    24/01/09
    Locatie
    Limburg
    Berichten
    38
    iTrader
    0
    Oke bedankt voor die tip beide!

    @Koebeest: Nouwja, ik slice niet met de slice tool dus vind ik basen wat geschikter. Ik ben ook eerder met graphics getrouwd dan met code, so don't get to harsh one me.

  8. #8
    Crew Member Zero Grav's schermafbeelding
    Lid sinds
    6/06/04
    Locatie
    Bilzen
    Berichten
    8.826
    iTrader
    18 (100%)
    Citaat Oorspronkelijk geplaatst door Curahee Q Bekijk bericht
    Ik vermoed dat het iets te maken heeft met het feit dat je right:0; hebt staan terwijl het right: 0px; moet zijn.
    Nul is nul, en dat is dan ook de enige waarde waar ge geen type bij móet vermelden.

  9. #9
    Member
    Lid sinds
    6/12/07
    Locatie
    Hoogstraten
    Berichten
    865
    iTrader
    0
    Ah oké, doe het uit gewoonte altijd en ik denk dat je dat best uit gewoone ook zo doet. Maarja, persoonlijke voorkeur.

Discussie informatie

Users Browsing this Thread

Op dit moment bekijken 1 gebruikers deze discussie. (0 leden en 1 gasten)

Regels voor berichten

  • Je mag geen nieuwe discussies starten
  • Je mag niet reageren op berichten
  • Je mag geen bijlagen versturen
  • Je mag niet je berichten bewerken
  •