Layout, de betere manier.

[Verwijderd]

Hi allemaal,

Ik ben al een aardige brok kaas gegeten van het opzetten van een website,
Ik ken HTML CSS en een beetje PHP (+SQL).
Ik maak mijn websites in dit soort vormen:


#div{
position:absolute;left:px;top:px;width:px;height:px;background:#2;}

#div2{
position:absolute;left:px;top:px;width:px;height:px;background:#;}

#div3{
position:absolute;left:px;top:px;width:px;height:px;background:#;}


maar zo is het altijd een standaard maat, zo krijg je in geen enkele browser de bepaalde div in het midden uitgelijnd, of van links tot rechts gevuld omdat je verschillende resoluties hebt.
Ik weet alleen niet hoe ik hiertoe kan komen, hoe kan je een site zo maken dat hij bijvoorbeeld in alle resolutes en browsers is gecentreerd of over het hele scherm verspreid.
Hoop dat het zo eenbeetje duidelijk is.

Sluix.

[JHS]

Ik zou zeggen gewoon de maten aangeven met % 'en

[Clay]

Layout in CSS regelen doe je door het combineren van de verschillende properties. position absolute (en relative) zijn er maar 2. Wat je net zo hard nodig hebt zijn de verschillende display types (block, inline, etc.) en floats (left, right, none). Padding en margin helpen er ook bij. Elementen richten zich ook naar de "flow", en het probleem wat jij dus nu hebt is dat je geen flow meer hebt, omdat alles op absolute staat

Centreren kan je bv weer doen door een element met een gedefinieerde breedte margin:auto; te geven (doctype verplicht, anders heb je nog wat andere truuks nodig).

[cutter]

Overigens zijn er heel veel sites die dit behandelen bijvoorbeeld:
http://www.bluerobot.com/web/layouts/

[JHS]

Clay schreef op 14 oktober 2004 @ 15:50:
(...) het probleem wat jij dus nu hebt is dat je geen flow meer hebt, omdat alles op absolute staat (...)
.

Dat kan op zich net zo goed met absoluut positioneren, lijkt mij, zolang je het relatief doet .

[André]

www.glish.com/css
http://www.alistapart.com/articles/fauxcolumns/
http://www.alistapart.com/articles/negativemargins/

En zo zijn er nog meer

[Verwijderd]

Bedankt ..
ik ga d'r mee aant werk,
tot de volgende vraag

[Clay]

JHS schreef op 14 oktober 2004 @ 16:18:
[...]
Dat kan op zich net zo goed met absoluut positioneren, lijkt mij, zolang je het relatief doet .

tuurlijk kan je met position:absolute; ook iets centreren. 't gaat er alleen om dat je weet waar je mee bezig bent. Als je altijd alles maar gewoon absolute maakt ben je voor veel gevallen gewoon nodeloos moeilijk aan het doen.

[JHS]

Clay schreef op 14 oktober 2004 @ 16:42:
[...]


tuurlijk kan je met position:absolute; ook iets centreren. 't gaat er alleen om dat je weet waar je mee bezig bent. Als je altijd alles maar gewoon absolute maakt ben je voor veel gevallen gewoon nodeloos moeilijk aan het doen.

Zeker waar

[Thijsmans]

#1:

Cascading Stylesheet:

.classnaam
{
    position: absolute;
    left: 50%;
    margin-left: -(breedte van de div gedeeld door twee)px;
}

Een ander die ik van Cheatah heb ( ):

Cascading Stylesheet:

body
{
    text-align: center;
}

.classnaam
{
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

en zo zijn er vast nog vele manieren

[sandiman]

Je kunt gewoon de center-tag gebruiken om een div te centreren.

ohjah, mocht je 'de betere layouts' zoeken moet je deze site maar eens doorspitten. Denk dat je er heel wat inspiratie uit kunt halen.

http://www.favouritewebsiteawards.com/

[Verwijderd]

JHS schreef op 14 oktober 2004 @ 16:18:
[...]
Dat kan op zich net zo goed met absoluut positioneren, lijkt mij, zolang je het relatief doet .

Iets absoluut positioneren, als je het maar relatief doet

[JHS]

Verwijderd schreef op 14 oktober 2004 @ 17:31:
[...]

Iets absoluut positioneren, als je het maar relatief doet

Ja , je positioneert dan absoluut, dwz met waardes tov de browser, niet tov andere elementen, maar wel met relatieve waardes, dus met x% of x em .

[Niakmo]

Prammenhanger schreef op 14 oktober 2004 @ 16:45:
#1:

Cascading Stylesheet:

.classnaam
{
    position: absolute;
    left: 50%;
    margin-left: -(breedte van de div gedeeld door twee)px;
}

Een ander die ik van Cheatah heb ( ):

Cascading Stylesheet:

body
{
    text-align: center;
}

.classnaam
{
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

en zo zijn er vast nog vele manieren

text align werkt toch alleen in IE voor een divje?

[curry684]

Sandiman schreef op 14 oktober 2004 @ 16:55:
Je kunt gewoon de center-tag gebruiken om een div te centreren.

The center element was deprecated in HTML 4.01.

The center element is not supported in XHTML 1.0 Strict DTD.

[Clay]

zirus schreef op 14 oktober 2004 @ 18:12:
[...]
text align werkt toch alleen in IE voor een divje?

text-align is voor ie5.0 en ie5.5 (en 6 in quirks), die snappen margin:auto; dan nml niet.

[Verwijderd]

waar gaat dit topic nou over?

[JHS]

Verwijderd schreef op 14 oktober 2004 @ 19:00:
waar gaat dit topic nou over?

_{Beetje rare vraag imo} Over hoe je het beste elementen kan positioneren lijkt mij

[Verwijderd]

TS zet alles in DIV`jes die absoluut worden gepositioneerd.
(daar heeft ie al een aardige brok kaas van gegeten)
Nu vraagt ie: Hoe krijg ik het in het midden of 100% breed?

Fijne vraag, maar daar is al zo vaak antwoord op gegeven hier.
(ik ga hier niet alle search-results voorkauwen, maar ik zou zeggen, probeer het eens)

Dus vandaar mijn opmerking: "waar gaat dit topic nou over?"

[ Voor 10% gewijzigd door Verwijderd op 14-10-2004 19:39 ]

[JHS]

<sub>zkywalker schreef op 14 oktober 2004 @ 19:38:
(...) Nu vraagt ie: Hoe krijg ik het in het midden of 100% breed?
Fijne vraag, maar daar is al zo vaak antwoord op gegeven hier. (...)

Nu vraagt hij dat niet direct, maar was dat meer een voorbeeld . Alleen kunnen dat soort opmerkingen denk ik beter in een TR, maar we raken hopeloos offtopic zo</sub>

[Verwijderd]

Over absoluut positioneren... Ik had een website eens absoluut gepositioneerd, maar IE gaat dan vervelend doen als je een stukje tekst wil selecteren.

Daarom liever de boel relatief houden wat mij betreft.

[AkaXakA]

http://intensivstation.ch/css/template.php
en natuurlijk
http://www.thenoodleincid...als/box_lesson/boxes.html

[JHS]

Verwijderd schreef op 14 oktober 2004 @ 19:53:
Over absoluut positioneren... Ik had een website eens absoluut gepositioneerd, maar IE gaat dan vervelend doen als je een stukje tekst wil selecteren.

Daarom liever de boel relatief houden wat mij betreft.

Mja, persoonlijk vind ik het niet genoeg reden, meestal is er voor de gebruiker / bezoeker ook niet echt veel reden om texten te selecteren, behalve ter verhoging vh. leesgemak, en het werkt volgens mij in principe ook in IE wel als je op de tekst dubbel / triple klikt
Overigens best raar eigenlijk dat de selectie van tekst raar gaat doen?