[in versie 6.4] Mobiele pagina css instellingen

krommetje3108 · Post by **krommetje3108** » Sun 19 Nov 2023, 10:39

Ik zou graag zien dat de volgende code zich NIET laat zien in de mobiele pagina', alleen maar in de pagina's waarin de juiste breedte is (PC/Laptop)

<!DOCTYPE html>
<html>
<head>
<style>
div.relative {
position: relative;
width: 00px;
height: 220px;
border: px solid #73AD21;
}
div.absolute {
position: absolute;
top: 150px;
left: 1150px;
width: 200px;
height: 100px;
border: 0px solid #73AD21;
}
div.absolute1{
position: absolute;
top: 150px;
left: 300px;
width: 250px;
height: 130px;
border: 0px solid #73AD21;
}
</style>
</head>
<body>

<h2>position: absolute;</h2>

<p>An element with position: absolute; is positioned relative to the nearest positioned ancestor (instead of positioned relative to the viewport, like fixed):</p>

<div class="relative"><img src="https://www.krommetje.nl/stamboom/wapen ... pg">;</div>
<div class="absolute"><img src="https://www.krommetje.nl/stamboom/kroms ... pg">;</div>
<div class="absolute1"><img src="https://www.krommetje.nl/stamboom/motto.jpg">;</div>

</div>

</body>
</html>

Het gaat erom dat het familiewapen, het Motto en de kleine familiefoto in die volgorde naast elkaar staan boven de centerbox. Ik heb het nu tijdelijk opgelost met een cms pagina maar daar ben ik ook niet happy mee

Post by **Huub** » Sun 19 Nov 2023, 20:03

Probeer eens "mobile_hidden" toe te voegen aan de class:

Code: Select all

<div class="relative mobile_hidden"><img src="https://www.krommetje.nl/stamboom/wapen ... pg">;</div>
<div class="absolute mobile_hidden"><img src="https://www.krommetje.nl/stamboom/kroms ... pg">;</div>
<div class="absolute1 mobile_hidden"><img src="https://www.krommetje.nl/stamboom/motto.jpg">;</div>

krommetje3108 · Post by **krommetje3108** » Mon 20 Nov 2023, 07:39

Dat ga ik doen, dank je wel, maar hoe ga ik dit binnen humo-gen implementeren?
Qua test kan ik werken met een Iframe. Dus ik roep menu.php aan in een iframe maar dat wordt niet altijd meer als veilig beschouwd in virusscanners...

Contributor · Post by **Contributor** » Wed 22 Nov 2023, 08:58

"Qua testen kan ik met een Iframe werken", een ifram doet niets voor testen en ifram = het kwaad van het web. Een ifram mag alleen worden gebruikt voor een component extern aan een applicatie (bijvoorbeeld een videocomponent) die deel uitmaakt van een API en een API-sleutel moet hebben.

Als er fouten in mijn tekst staan, is het de schuld van Google Trad, lol

krommetje3108 · Post by **krommetje3108** » Tue 30 Apr 2024, 17:44

Huub,

ik heb dit weer even opgepakt. De structuur van Humo is fundamenteel veranderd.

Ik had dit toe willen voegen aan menu.php als php echo maar omdat die niet meer bestaat, kan ik dit als PHP Echo toevoegen aan Index.php?
ik heb de lay-out die ik wilde via de CMS toegevoegd maar wil toch iets van mijn oorspronkelijke idee terug.

Code: Select all

<!DOCTYPE html>
<html>
<head>
<style>
div.relative {
  position: relative;
  width: 00px;
  height: 220px;
  border: px solid #73AD21;
} 
div.absolute {
  position: absolute;
  top: 140px;
  left: 1150px;
  width: 200px;
  height: 100px;
  border: 0px solid #73AD21;
}
div.absolute1{
  position: absolute;
  top: 150px;
  left: 300px;
  width: 250px;
  height: 130px;
  border: 0px solid #73AD21;
}
</style>
</head>
<body>

<center><h1>Welkom op het familiearchief Krom</h1></center>

<div class="relative mobile_hidden"><img src="https://www.krommetje.nl/stamboom/wapen_thn_half.jpg">;</div>
<div class="absolute mobile_hidden"><img src="https://www.krommetje.nl/stamboom/kromscholverhoeven.jpg">;</div>
<div class="absolute1 mobile_hidden"><img src="https://www.krommetje.nl/stamboom/motto.jpg">;</div>

</div>

</body>
</html>

p.s. kan het onderwerp aangapast worden naar LAY-OUT veranderen o.i.d.?

Post by **Huub** » Tue 30 Apr 2024, 18:30

Ik ben nog lang niet klaar met ombouwen. Ik ben nog veel meer CSS code aan het wijzigen.
Eigenlijk ben ik heel veel CSS code aan het opruimen, en schakel ik over naar Bootstrap.

Ik heb net een nieuwe versie uitgebracht, daarin is er weer code aangepast, en CSS codes opgeruimd.

Post by **Huub** » Tue 30 Apr 2024, 18:44

Het menu zit nu hier:
views/layout.php

HuMo-genealogy software.

[in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen

Re: [in versie 6.4] Mobiele pagina css instellingen