Centrera div i div (horisontellt och vertikalt)

Permalänk
Skrivet av thulin82:

@ibrakadabra: det innebär att om du kör ovan script i en fil som heter form.php, så returnerar php-utskriften strängen "form.php"

det betyder att när du klickar på submit-knappen i form:en så skickas resultatet i form av en POST till sig själv, denna POST tas sedan om hand av den nedre php-delen

Vänta lite nu. Var kommer form.php in i bilden?

Jag känner mig verkligen trög. Vill du försöka förklara för mig, från början, som om jag är 5 år gammal?

Jag vill inte vara jobbig, jag är tacksam över all hjälp!

Permalänk
Medlem

@ibrakadabra: Ska se om jag kan hjälpa dig bena ut vad koden gör.

Säg att du har en fil som heter 'index.php' och den innehåller följande kod:

<html> <body> <form method="post" action="<?php echo $_SERVER['PHP_SELF'];?>"> Name: <input type="text" name="fname"> <input type="submit"> </form> <?php if ($_SERVER["REQUEST_METHOD"] == "POST") { // collect value of input field $name = $_REQUEST['fname']; if (empty($name)) { echo "Name is empty"; } else { echo $name; } } ?> </body> </html>

Om vi börjar med form delen:

<form method="post" action="<?php echo $_SERVER['PHP_SELF'];?>">

method="post" - anger vilken metod som ska användas för anropet man gör när man skickar formuläret, dvs när man klickar på submit. I detta fallet ska en 'post' begäran skickas, vilket är det vanliga när man ska skicka information, man postar det.

action="<urladress>" - action avser vart du vill skicka informationen, till vilken adress/fil

echo $_SERVER['PHP_SELF']; - står inom php-taggar och körs således bara på servern och det den gör är att ta fram filnamnet i vilken koden befinner sig i. Den tar alltså filnamnet från 'SELF' - sig själv. Och eftersom filen som koden ligger i heter 'index.php' är det detta som returneras. echo - betyder att den ska skriva ut resutatet i klartext i html-koden. Om användaren tittar på koden i sin webläsare kommer hen att se: action="index.php"

<input type="text" name="fname"> - Här gör vi ett fält som heter 'fname' och som innehåller text

Nästa del i koden körs endast om sidan anropas av en post-begäran, det normala när man tex klickar på länkar och skriver in adresser i webläsaren är att en GET-begäran skickas. Det finns fler sorters anrop men dom struntar vi i nu
Säg att vi klickar på skicka i formuläret, då används det vi angett i <form>dvs metoden 'post' och anropet skickas till action, som var 'index.php', dvs samma fil som vi redan är i.
Nu har vi ju begärt att få samma fil igen, 'index.php' MEN denna gången har vi begärt att få den med metoden 'post' istället för 'get', och då kickar denna kodsnutten in:

if ($_SERVER["REQUEST_METHOD"] == "POST") { // collect value of input field $name = $_REQUEST['fname']; if (empty($name)) { echo "Name is empty"; } else { echo $name; } }

Vi går igenom den:
if ($_SERVER["REQUEST_METHOD"] == "POST") { - översatt blir detta typ: 'om anropsmetoden är post' och det är den ju när vi klickat på submit. Här använder vi inte echo eftersom inget ska skrivas ut till HTML, vi vill bara läsa av den.

$name = $_REQUEST['fname']; - I '$_REQUEST' lagras all data från fälten i formuläret och i detta fallet vill vi lagra datan från fältet 'fname' i formuläret, i en variabel som heter '$name'.

if (empty($name)) { - Detta betyder 'om $name är tomt'

echo "Name is empty"; - Detta skriver ut "Name is empty" till HTML-koden så vi kan se den.

echo $name; - Och detta skriver ut innehållet i '$name' vilket ju är detsamma som i '$_REQUEST['fname']' vilket i sin tur är det samma som innehållet i inputfältet 'fname' från formuläret

Hoppas det klarnade lite!

Visa signatur

Oldschool [å:ldsku:l] adj. Användandet av datorprodukter som är äldre än 3 månader.

Permalänk

@thulin82 @kundun

Stort tack för er hjälp!

Hoppas admin tycker att det är OK att denna tråden svävar ut lite. Det lär dyka upp fler frågor.

Tack igen!

Permalänk

Okej.. En konstig grej har uppstått. "Surfade" in på min sida nyss via "file:///C:/Users/..." som vanligt. Och nu är alla bilder på mina sidor "broken". Vad fan kan detta bero på? Jag har testat att rensa allting i Chrome, även tillfälligt stängt av Addblock t.ex.

Permalänk
Medlem

@ibrakadabra

Du måste använda dig av exempelvis WAMP eller MAMP för att köra PHP-skript lokalt. Det går inte att köra PHP-skript eller filer med PHP-kod via file://.

Permalänk
Skrivet av kevvs:

@ibrakadabra

Du måste använda dig av exempelvis WAMP eller MAMP för att köra PHP-skript lokalt. Det går inte att köra PHP-skript eller filer med PHP-kod via file://.

Hej!

Ja, så korkad jag är. Jag kom på att min wamps servern inte var igång. Glömde redigera mitt svar. Tack @kevvs

Skickades från m.sweclockers.com

Permalänk

@media rule

Hej!

Min hemsida börjar väl bli hyfsat klar och jag har nu börjat pula med hur den ska se ut i olika skärmstorlekar etc. Jag har då snubblat över "@media rule" (https://www.w3schools.com/cssref/css3_pr_mediaquery.asp) som verkar rätt smidig att använda.

I de flesta exempel på den sidan används den direkt i HTML-koden. Är det någon som vet ifall den går att använda i CSS-filen direkt istället?

Alltså, typ:

@media screen and (min-width: 480px) { body { background-color: lightgreen; } }

Jag har försökt ange det i min CSS-fil, men det verkar inte fungera så bra, det blir liksom ingen annorlunda syntax-färg eller sådär på själva CSS-koden.

Permalänk
Medlem
Skrivet av ibrakadabra:

Hej!

Min hemsida börjar väl bli hyfsat klar och jag har nu börjat pula med hur den ska se ut i olika skärmstorlekar etc. Jag har då snubblat över "@media rule" (https://www.w3schools.com/cssref/css3_pr_mediaquery.asp) som verkar rätt smidig att använda.

I de flesta exempel på den sidan används den direkt i HTML-koden. Är det någon som vet ifall den går att använda i CSS-filen direkt istället?

Alltså, typ:

@media screen and (min-width: 480px) { body { background-color: lightgreen; } }

Jag har försökt ange det i min CSS-fil, men det verkar inte fungera så bra, det blir liksom ingen annorlunda syntax-färg eller sådär på själva CSS-koden.

Hur testar du? Räcker inte med att göra webbläsaren mindre.

Permalänk
Medlem
Skrivet av ibrakadabra:

I de flesta exempel på den sidan används den direkt i HTML-koden. Är det någon som vet ifall den går att använda i CSS-filen direkt istället?

Går alldeles utmärkt att använda i CSS-filen.

Permalänk

@thulin82 @hultron

Haha, jag har egentligen inte testat... Jag tyckte bara att det var så konstigt att syntaxen inte ändrade någon färg i koden i notepad++. Ursäkta om jag slösade er tid nu (när jag inte ens har prövat), jag ska naturligtvis testa det då, om ni nu säger att det ska fungera.

Tack för svar!

Permalänk

@media

Hej på er!

Så, nu har jag prövat @media, och jag får det inte att fungera. Jag tänkte visa min kod nedan, så att ni kan se om jag över huvudtaget gör något rätt. Det är lite problematiskt att testa det på ett smidigt sätt, eftersom det ibland är en ganska stor delay från det att man förnyar CSS-filen på webhotellet till att ändringarna träder i kraft på hemsidan.

Jag har en div vars klass heter picright, och en annan div vars klass heter picright. CSS-filen ser ut enligt följande:

.picright { float:right; margin-left:45px; margin-top:100px; } .picleft { float:left; margin-right:45px; margin-top:100px; }

Och, det jag vill ändra när en användare med mindre skärm kommer in på sidan är enligt följande:

@media screen and (max-width: 700px) { .picright { margin-left:10px; } .picleft { margin-right:10px; } }

Det blir dock ingen skillnad när jag surfar in på den med min telefon eller surfplatta. Jag har testat att bara ha med picleft eller picright inom @media-taggarna, men ingen skillnad.

Nåra idéer?

Permalänk
Medlem

Använd utvecklarläget i tex chrome (F12) där kan du växla till mobilläge och se storleken direkt
Vill du göra en ny, hård inläsning högerklickar du på refreshknappen i webläsaren och väljer 'töm cache och gör en hård inläsning'

Visa signatur

Oldschool [å:ldsku:l] adj. Användandet av datorprodukter som är äldre än 3 månader.

Permalänk
Skrivet av kundun:

Använd utvecklarläget i tex chrome (F12) där kan du växla till mobilläge och se storleken direkt
Vill du göra en ny, hård inläsning högerklickar du på refreshknappen i webläsaren och väljer 'töm cache och gör en hård inläsning'

Tjena!

Testade det du sa angående hård inläsning och tömning av cache. Jag gjorde ett test, och gjorde bakgrundsfärgen till röd i CSS-filen, laddade upp den nya CSS-filen via ftpn och körd hård inläsning etc. Men det tar fortfarande tid innan CSS-filen tycks laddas upp.

Jag återkommer när jag testat lite till.

Permalänk
Medlem

@ibrakadabra
Ditt webbhotell kan ha exempelvis Varnish (cacheminne mellan besökare och server kan man säga) för att snabba upp åtkomsten till sajten. Vad har du för webbhotell? Jag vet att exempelvis One.com och Citysites.se kör med Varnish.