webForumDet fria alternativet

"Texten i mitten"-Hur gör jag?

7 svar · 945 visningar · startad av Isza-96

Isza-96Medlem sedan apr. 200924 inlägg
#1

Jag ska försöka mig på en webbplats där texten står i mitten som på den här sidan: http://www.tallinksilja.com/sv/

Problemet är att jag inte vet hur man gör. Ramar och tabeller bör man väl undvika, så hur gör man då? Kan jag med hjälp av olika div:ar lösa det eller hur gör man på enklaste sätt?

Jag vill alltså ha färg på sidorna och själva texten/bilderna i mitten på vit bakgrund. Det behöver inte vara exakt som länken visar utan huvudsaken är att det är text/bilder i mitten och färg på sidorna om detta. Gärna med en tunn synlig kantlinje runt innehållet.

Jätteglad om jag kan få lite hjälp!

JAreMANNENMedlem sedan aug. 20002 272 inlägg
#2
<html>
<head>
</head>
<body style="background-color:Aqua; margin:0; padding:0;">
<div style="width:800px; margin:0 auto; background-color:#fff;">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta eros a sem blandit a ultricies nulla pharetra. Mauris feugiat venenatis nulla sed rhoncus. Proin convallis euismod libero vel sodales. Morbi eu commodo velit. Maecenas ligula nulla, fringilla ut ullamcorper sit amet, semper sed arcu. Morbi dapibus nisi eget sapien tristique egestas. Sed volutpat, felis a gravida eleifend, nulla diam auctor augue, eget vehicula metus mi eu risus. Quisque quis mollis massa. In hac habitasse platea dictumst. Suspendisse sed nisl nisi, malesuada gravida nisi. Nullam consectetur pharetra porttitor. Ut convallis molestie condimentum. Vestibulum sodales est nec elit blandit bibendum. Vestibulum ac arcu a metus iaculis consequat nec nec nisl. Ut in fermentum ipsum. Nullam pretium, nulla ut feugiat lacinia, leo nibh vehicula massa, faucibus varius turpis mauris id sapien. Aliquam et nulla purus, a ornare dui.

Praesent quis purus sit amet felis elementum dapibus sed quis lorem. Cras vitae mauris mi. Nullam condimentum congue tortor. Vivamus nec molestie nulla. Nulla nec sapien et ligula dictum gravida ut eu ligula. Morbi volutpat mauris dictum nibh posuere egestas. Suspendisse purus arcu, posuere tempor auctor ac, commodo mollis risus. Integer placerat cursus sem eget laoreet. Phasellus viverra, velit quis vulputate auctor, nunc leo lobortis tortor, sit amet placerat orci enim malesuada lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed dapibus ante vitae nibh congue laoreet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut laoreet nunc eget orci tempus interdum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum turpis nunc, dignissim et bibendum sed, facilisis eu lectus. In hac habitasse platea dictumst. Aenean sit amet nisi tortor, eget consequat lorem.

Suspendisse potenti. Nullam posuere metus a diam tempus dictum ut ac felis. Donec sapien velit, venenatis at adipiscing elementum, tempor sit amet nisl. Aliquam tristique lacus nec dui sodales pellentesque. In auctor posuere turpis a feugiat. Duis congue ultricies nulla in cursus. Curabitur mi dui, aliquet eget eleifend at, sollicitudin id lectus. Ut condimentum dictum euismod. Cras consequat, sapien eget aliquam eleifend, lorem purus gravida augue, lobortis luctus tellus augue quis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque ut facilisis quam. Vestibulum justo tellus, ultricies quis dignissim ac, facilisis ac nisl. Quisque sodales, eros egestas elementum ultricies, nulla nisi suscipit enim, id mattis massa diam vitae justo. Vestibulum laoreet urna at velit elementum vulputate.

Vestibulum in mauris ipsum, quis mollis mauris. Nam dapibus bibendum dui, vel ultricies tellus tempor vitae. Suspendisse et nisl sit amet diam viverra cursus et id neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam at nibh eros. Ut eget mauris elit, sit amet pellentesque justo. Phasellus ut sem vel dui rutrum mollis tincidunt sed nulla. Morbi non dignissim libero. Phasellus fringilla, ante eu ultrices accumsan, lectus lorem convallis velit, rutrum facilisis enim odio vitae ligula. Nunc tincidunt lectus nec augue tristique scelerisque fringilla leo iaculis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur vulputate velit sodales nisi blandit porta fermentum elit sodales. Pellentesque eget enim in justo laoreet cursus vel eget lorem. Maecenas interdum ipsum nec nibh tincidunt suscipit. Praesent tincidunt pretium elit, non placerat dolor convallis sed. Morbi at sem quis purus lacinia ornare nec sed metus. Donec feugiat, est ut convallis fringilla, sapien dui placerat ipsum, non pharetra nunc orci at ligula. Mauris quis odio mi. Fusce sed augue non justo imperdiet dignissim.

Phasellus lacinia velit sed risus tristique auctor. Suspendisse ultricies elit non sem mollis mattis. Nam quam tortor, lobortis sed sodales nec, cursus at turpis. Maecenas volutpat nibh vel velit convallis iaculis. Pellentesque elit dui, pretium condimentum eleifend sit amet, blandit ut mauris. Donec euismod euismod venenatis. Cras ac eros justo, in iaculis nulla. Donec facilisis, risus et convallis luctus, tortor arcu imperdiet enim, sed convallis augue enim sed mi. Fusce massa sem, tristique nec commodo id, rutrum at leo. Curabitur rutrum, mauris vehicula scelerisque luctus, dolor justo condimentum libero, sed rutrum urna quam a eros. Quisque in nibh vitae neque eleifend convallis. Donec magna ante, aliquam sit amet fermentum at, egestas eu mauris. Aliquam vitae ligula feugiat metus ullamcorper lacinia. 
</div>
</body>
</html>

Vääääääääääääldigt enkelt exempel men det är en hjälp på vägen!

Lycka till!

Isza-96Medlem sedan apr. 200924 inlägg
#3

Tack, jag ska testa och se om jag kan komma vidare!

Isza-96Medlem sedan apr. 200924 inlägg
#4

Jag kanske ska tillägga att jag har en extern CSS-mall. Undrar också vad själva "tekniken" för det jag frågar efter heter. Är det ramar, boxar eller annat? Jag är en verklig nybörjare och skulle behöva lite mer kött på benen för att komma igång.

headbugMedlem sedan sep. 2006867 inlägg
#5

Det du kan söka på som är relevant här är:

centering content
centering div css

Även om JAreMANNENs tips är inskrivet inline i HTML-dokumentet så är det inget som hindrar dig från att ta exakt samma stilmall och flytta till ditt externa CSS-dokument!

Jag har en favorit-sida för många css-relaterade frågor och här går han igenom hur man centrerar innehåll enkelt och pedagogiskt: http://www.maxdesign.com.au/presentation/center/

MeddaMedlem sedan juni 200913 inlägg
#6

googla pa html och lar dig mer...
jag skulle vilja rekomendera webdesignskolan...
sedan i deras forum har dem diverse lankar till fler bra sidor :)
jag har ju en egna guider pa medda86.com, dem ar lite sjuka kanske XD

Isza-96Medlem sedan apr. 200924 inlägg
#7

Jag är jätteglad för alla svar men jag kommer inte vidare. vet inte om jag är oklar eller bara för mycket nybörjare för att förstå hur jag ska göra? :-)

Det jag ska göra är alltså en webbplats i XHTML och en extern CSS-mall. Jag vill att sidan ska ha tre spalter där den i mitten är bredast och innehåller text och bilder. Efter att ha googlat och läst era tips har jag förstått att det finns flera sätt att göra detta på. Jag är i det läget att jag bara vill att det ska fungera, inget extra "lullull" alltså. ;-)

Länk: http://edu.ikd.hik.se/students/sandberg9ntc3isabell/publicera5/kryssalugntgrekland.php

Någon som orkar titta på detta (igen..)?

headbugMedlem sedan sep. 2006867 inlägg
#8

Då gör du såhär till att börja med:

CSS:en måste ändras lite

body { margin: 0px; padding: 0px; text-align: center; }

#hela {background-color:#FFFFFF; font-size:100%;line-height:150%;margin:0 auto; width:770px; text-align: left; }
139 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)