Problem med positionering av text (HTML5)

2014-07-07 22:11

Medlem

Registrerad: Jul 2014

●

Problem med positionering av text (HTML5)

Har testat min sida i safari, firefox, chrome samt explorer och på min skärm ser allt likadant ut. När vi öppnar upp samma sida på ex en mac book pro så visarden helt fel, även på en annan pc. Text flyter in i varandra osv. fattar ingenting då vad jag kan se så är det inställt i dreamweaver att fungera på allt... Blir tokig. catalinaimre.se hjälp snälla!

Förtydligad rubrik

Rapportera Redigera

Citera flera Citera

2014-07-07 22:32

Medlem

Plats: 192.168.1.253
Registrerad: Dec 2010

●

Jag hade ett problem när jag skulle lämna in min slutuppgift i webbutveckling. Den ville inte läsa allt korrekt bara för att servern var linux baserad och de har ett system med stor och liten bokstav.
Jag börjar undra om det är att du helt enkelt slarvat i namnangivandet och med tecken som: ".

Hur som helst ger du oss väldigt lite att gå på och du borde kanske ge lite mer information om du vill ha hjälp.

Visa signatur

Citera för svar!

Rapportera Redigera

Citera flera Citera

2014-07-07 22:47

Medlem

Plats: Solna, Stockholm
Registrerad: Dec 2010

●

Nu vet jag inte hur det ska se ut, men här sitter jag på en Macbook Pro (15" Retina, OS X 10.10) och ser ingen text som korsar, se bild

Visa signatur

Citera för svar!|Fraktfritt hos INET|Min hemsida
Fractal Design Define R3|Corsair AX 850W|Gigabyte Nvidia GeForce GTX 570|Corsair Vengeance 1600MHz 2x4GB|ASRock P67 Extreme4|Intel Core i5 2500K|2x Samsung Spinpoint F3 1TB|Samsung Blu-Ray läsare
Nikon D7000|Nikon 60mm macro|Nikon 18-70|Nikon 55-300|Nikon 10.5 Fisheye

Rapportera Redigera

Citera flera Citera

2014-07-07 22:48

Medlem

Plats: Dasseborg
Registrerad: Jul 2008

●

Skrivet av Tinnity123:

Har testat min sida i safari, firefox, chrome samt explorer och på min skärm ser allt likadant ut. När vi öppnar upp samma sida på ex en mac book pro så visarden helt fel, även på en annan pc. Text flyter in i varandra osv. fattar ingenting då vad jag kan se så är det inställt i dreamweaver att fungera på allt... Blir tokig. catalinaimre.se hjälp snälla!

Gå till inlägget

Ser väl Ok ut i mitt Firefox förrutom att Livsmedel står lite utanför linjen, annars ok med resten.

Visa signatur

Alienware Aurora

Rapportera Redigera

Citera flera Citera

2014-07-07 22:54

Medlem

Registrerad: Jul 2014

●

Skrivet av fAkkFejz:

Ser väl Ok ut i mitt Firefox förrutom att Livsmedel står lite utanför linjen, annars ok med resten.
http://i.imgur.com/BF3a5IT.png

Gå till inlägget

'

Ser helt fel ut, min är på ett annat sätt, hur postar jag bilder?

Rapportera Redigera

Citera flera Citera

2014-07-07 22:58

Medlem

Registrerad: Apr 2013

●

Skrivet av Tinnity123:

Ser helt fel ut, min är på ett annat sätt, hur postar jag bilder?

Gå till inlägget

ladda upp det här

https://imageshack.com/

Visa signatur

min kanal heter lär dig blender
https://www.youtube.com/channel/UCAtF52Txk_4x-gJGmPm-mmw
ok den handlar om blender och hårdvara och sånt

Rapportera Redigera

Citera flera Citera

2014-07-07 22:58

Medlem

Registrerad: Jul 2014

●

Skrivet av phroggyy:

Nu vet jag inte hur det ska se ut, men här sitter jag på en Macbook Pro (15" Retina, OS X 10.10) och ser ingen text som korsar, se bild

http://i.imgur.com/2Hq9yhi.jpg

Gå till inlägget

S ser det ut för mig också:)

Rapportera Redigera

Citera flera Citera

2014-07-07 23:00

Medlem ★

Plats: Stockholm
Registrerad: Jan 2010

●

Ser okej för mig i Chrome i alla fall. Vet inte om det har ändrats något sedan jag gick i gymnasiet men då var det problem med upplösningar. Så man var tvungen att sätta en standard som alla kan använda t.ex inte 1920x1080 på den tiden
http://3.ii.gl/HZoP2z8V.png

Visa signatur

AMD 5800x3d | ASUS x570 | Samsung SSD EVO 850 500GB | Corsair 32GB (2x8GB) 3600Mhz | Noctua NH-D15 | ASUS TUF OC 4090 | Fractal design R6 | Corsair RM1000X | LG UltraGear 27GL850 x2

Rapportera Redigera

Citera flera Citera

2014-07-07 23:04

Medlem ★

Plats: Stockholm
Registrerad: Aug 2009

●

Hela HTML koden är en jävla hög av

<br><br><br><br><br>

Kolla in vad bootstrap är och ladda ner det. Lär dig det (tar 1 dag) och kasta det du har just nu i papperskorgen.

Varför det blir annorlunda beror på olika skärmupplösningar, och din sida hanterar inte detta (kallas "responsivdesign")
bootstrap gör detta åt dig.

Avinstallera dreamweaver fort som ögat när du väl är igång och ladda ner sublime text eller phpstorm.

Visa signatur

AW3423DW QD-OLED - Ryzen 5800x - MSI Gaming Trio X 3090 - 64GB 3600@cl16 - Samsung 980 Pro 2TB/WD Black SN850 2TB

Rapportera Redigera

Citera flera Citera (1)

2014-07-07 23:10

Medlem ★

Plats: Göteborg
Registrerad: Jul 2007

●

Det ser ut som fan i Google Chrome 35.0.1916.153 (Officiell version 274914) på Windows 8.1

Det ser jävligt ut i IE 11.0.9600.17126

Du positionerar text med en massa radbrytningar (<br/>-taggar) vilket jag kan tycka inte är helt rätt. Du blandar CSS i både stilattribut och i din stilmall. Nu var det visst bara en förekomst, men iallafall.

Loggan tar i mitt tycke för stor plats; nästan halva min skärm (sitter på en bärbar maskin med liten skärm) så jag får dubbla scrollbars.

Jag tror i att det mesta ligger i hur du positionerar medelst marginaler, olika webbläsare har fortfarande inte kommit överrens om standardvärden på olika attribut - tillexempel padding och margins. Testa att köra utvecklingsverktyget i olika webbläsare (tryck F12 i de flesta) så kan du se varifrån de olika elementen hämtar parametrar.

Visa signatur

Jag är en optimist; det är aldrig så dåligt så att det inte kan bli sämre.

Rapportera Redigera

Citera flera Citera

2014-07-07 23:11

Medlem

Plats: Dasseborg
Registrerad: Jul 2008

●

Ser ok ut i win8 IE iaf. så varför nyaste FF visar annorlunda vet jag inte?
IE >>

Visa signatur

Alienware Aurora

Rapportera Redigera

Citera flera Citera

2014-07-07 23:13

Hedersmedlem ★

Registrerad: Jan 2005

●

*Tråd rensad, rubrik justerad*

Håll diskussionen på en saklig nivå, inga påhopp tack. Det går bra att justera rubriken i efterhand.

Citat:

§ 1.1 Var trevlig och respektera andra.

/moderator

Visa signatur

Danskjävel så krattar som en skrivare...

Rapportera Redigera

Citera flera Citera

2014-07-07 23:40

Medlem

Registrerad: Jul 2014

●

Skrivet av celoz:

Hela HTML koden är en jävla hög av

<br><br><br><br><br>

Kolla in vad bootstrap är och ladda ner det. Lär dig det (tar 1 dag) och kasta det du har just nu i papperskorgen.

Varför det blir annorlunda beror på olika skärmupplösningar, och din sida hanterar inte detta (kallas "responsivdesign")
bootstrap gör detta åt dig.

Avinstallera dreamweaver fort som ögat när du väl är igång och ladda ner sublime text eller phpstorm.

Gå till inlägget

Ska kolla in det direkt, använder inga speciella funktioner i dw ändå:)

Skickades från m.sweclockers.com

Rapportera Redigera

Citera flera Citera

2014-07-07 23:42

Medlem

Registrerad: Jul 2014

●

Skrivet av zyberzero:

Det ser ut som fan i Google Chrome 35.0.1916.153 (Officiell version 274914) på Windows 8.1

Det ser jävligt ut i IE 11.0.9600.17126

Du positionerar text med en massa radbrytningar (<br/>-taggar) vilket jag kan tycka inte är helt rätt. Du blandar CSS i både stilattribut och i din stilmall. Nu var det visst bara en förekomst, men iallafall.

Loggan tar i mitt tycke för stor plats; nästan halva min skärm (sitter på en bärbar maskin med liten skärm) så jag får dubbla scrollbars.

Jag tror i att det mesta ligger i hur du positionerar medelst marginaler, olika webbläsare har fortfarande inte kommit överrens om standardvärden på olika attribut - tillexempel padding och margins. Testa att köra utvecklingsverktyget i olika webbläsare (tryck F12 i de flesta) så kan du se varifrån de olika elementen hämtar parametrar.

Gå till inlägget

Ska testa, för mig ser det ju jätte bra ut:/ vad använder proffsen ist för <br?

Skickades från m.sweclockers.com

Rapportera Redigera

Citera flera Citera

2014-07-07 23:51

Medlem

Plats: Linköping
Registrerad: Jul 2011

●

Skrivet av Tinnity123:

Ska testa, för mig ser det ju jätte bra ut:/ vad använder proffsen ist för <br?

Skickades från m.sweclockers.com

Gå till inlägget

<p> är väl ganska vanligt att man lägger text-innehåll i.

Edit: var lite väl snabb där, för att placera text brukar man använda flera <div> med olika margin och padding. Använd även <h1>, <h2> osv för att skapa rubriker. Kolla som sagt på bootstrap, ganska lätt att lära sig och fungerar underbart när man ska gå mellan olika storlekar på skärmar.

Senast redigerat 2014-07-07 23:57

Visa signatur

NZXT Phantom 410 (Vit) | i5 3570k@4.2GHz | Asus P8Z77-V LE | Corsair Vengeance LP 1600MHz 16GB | Gigabyte GTX 670 Windforce OC @1GHz | Seagate 600 480GB | Corsair HX750 | Cooler Master 212 Evo

Rapportera Redigera

Citera flera Citera (1)

2014-07-08 03:13

Medlem ★

Plats: Sundsvall
Registrerad: Dec 2006

●

Det skrek NEJ NEJ NEJ i mitt huvud så fort jag såg att du använder CENTIMETER istället för pixlar/procent när du bestämmer höjd/bredd på elementen. Samtidigt använder du marginaler i pixlar för att positionera elementen.
Retina skärmar har en större pixeltäthet och, vad jag misstänker, visas även centimeter annorlunda på grund av det.

Detta är helt och hållet fel.
Du borde ta och läsa upp om CSS boxmodellen, specifikt hur man använder "float".

Här är ett exempel jag har gjort:

http://jsfiddle.net/eFC75/3/

Här är en kod jag knackade ihop jättefort som visar hur otroligt simpelt det är att göra grundstrukturen på en hemsida. Använd den som du behagar.
Notera: Du kan ändra "kartong" bredden till vad du vill. Eftersom dina lådor är i procent så kommer dom anpassa sid automatiskt.

Visa signatur

Canon 70D | 2x Dell Ultrasharp 24" | Ryzen 3700X | 32B | GTX 1080Ti

Rapportera Redigera

Citera flera Citera (3)

2014-07-08 15:44

Medlem

Registrerad: Nov 2011

●

Ok.. Använd inte Dreamweaver då det är ett program för folk som vill kunna programmera genom "klick" d.v.s. ingenting att rekommendera. Använd CSS istället för Iframe osv...

Rapportera Redigera

Citera flera Citera

2014-07-08 15:53

Medlem

Registrerad: Nov 2011

●

Använd detta i Wrapper istället...

Width: 70%; (Eller vilket procentuellt värde utav användarens skärm som du vill att sidan ska ta upp..) Använd inget bestämt width värde..

Rapportera Redigera

Citera flera Citera

2014-07-08 16:32

Medlem

Registrerad: Jul 2014

●

[qut, e=Florrpan;14719051]Det skrek NEJ NEJ NEJ i mitt huvud så fort jag såg att du använder CENTIMETER istället för pixlar/procent när du bestämmer höjd/bredd på elementen. Samtidigt använder du marginaler i pixlar för att positionera elementen.
Retina skärmar har en större pixeltäthet och, vad jag misstänker, visas även centimeter annorlunda på grund av det.

Detta är helt och hållet fel.
Du borde ta och läsa upp om CSS boxmodellen, specifikt hur man använder "float".

Här är ett exempel jag har gjort:

http://jsfiddle.net/eFC75/3/

Här är en kod jag knackade ihop jättefort som visar hur otroligt simpelt det är att göra grundstrukturen på en hemsida. Använd den som du behagar.
Notera: Du kan ändra "kartong" bredden till vad du vill. Eftersom dina lådor är i procent så kommer dom anpassa sid automatiskt.[/quoja

Tack, känns så trist att jag suttit med detta projekt en vecka och deadline är om några dagar... har ju aldrig gjort detta förr:( ska försöka göra om allt. Synd att jag inte frågade er tidigare. Allt såg ju bra ut på min skärm och validerade korrekt.

Skickades från m.sweclockers.com

Rapportera Redigera

Citera flera Citera