ik heb geen scrollbars

Status
Niet open voor verdere reacties.

shimai01

Gebruiker
Lid geworden
6 apr 2018
Berichten
11
Hallo allemaal, ik heb hier zo wat rondgekeken middels de zoekfunctie maar ik krijg het nu niet direct gevonden waar ik naar op zoek ben, nml het volgende;

Voor een kennis heb ik zijn site aangepast, maar nu ik de site wat meer vergroot heb qua kolom hoogte e.d. mis ik eigenlijk de scrollbar functie, het is nu bijv. op een ipad of een wat ouder kleiner scherm niet mogelijk om de onderzijde van bepaalde zo niet alle pagina's te bereiken.

de url van de site is www.desfeermakers.com

Nuttige opmerkingen aangaande de site die niets met de scroll functie te maken zijn overigens ook welkom hoor.

gr. Shimai
 
Ik raad aan om je te verdiepen in RWD; Responsive WebDesign. Zo kan je je site makkelijk de juiste vorm laten aannemen afhankelijk van de soort device (mobiel, tablet, desktop).
 
Ok, thnx, ga ik eens naar kijken ja!
Ik hoop niet dat ik finaal opnieuw moet beginnen maar stapsgewijs de site ‘mobile’ proof e.d. Kan maken.’
 
Als je de position:fixed bij #container weghaalt dan heb je weer scrollbars.
Code:
html, body {
    margin: 0;
    height: 100%;
}
#container {
    min-height: 100%;
    /* position:fixed; */
    width: 100%;
    background: url("images/logobig_bg.png") center bottom no-repeat;
}

Een @font kan je het beste zo opgeven voor weergave op alle browsers
Code:
@font-face {
    font-family: 'Ubik';
    src:url(UbikCondensed.eot);
    src:url(UbikCondensed.eot?#iefix) format('embedded-opentype'),
        url(UbikCondensed.woff2) format('woff2'),
        url(UbikCondensed.woff) format('woff'),
        url(UbikCondensed.ttf) format('truetype'),
        url(UbikCondensed.svg#UbikCondensed) format('svg');
}
body {
    font-family: 'Ubik', sans-serif;
    font-weight: normal;
    line-height: 1.4;
}
.eot voor oude IE6-IE9 (end of life)
.woff2 & .woff voor huidige browsers
.ttf voor Android & iOS (beide t/m versie 4.x)
.svg voor Chrome/Safari op iOS (t/m versie 4.x)

In de praktijk heb je alleen .woff2 en .woff nodig. Dan ondersteun je alle browsers vanaf het IE 10 tijdperk behalve oude Android browsers die pas vanaf het IE 11 tijdperk .woff ondersteunen.
Als je de oude smartphones/tablets wilt ondersteunen dan heb je .ttf (Android t/m 4.3) en eventueel .svg (iOS t/m 4.3) nodig.
De nieuwste browsers ondersteunen allemaal .woff en/of .woff2 (browsers: Samsung, QQ, Baidu, UC, enzovoort)

Suc6. Have fun.
 
Laatst bewerkt:
Dank voor de bootstrap tip
Ik ben druk aan de slag gegaan en e.e.a. is reeds aangepast.

Wat ik wel aantref is dat ik bijv. op de contact pagina het tel nr. en het email adres niet klikbaar kan maken, iemand daar een idee over?

www.desfeermakers.com


Suggesties uiteraard meer dan welkom
 
Code:
<div class="intro-button mx-auto">
<a class="btn btn-primary btn-xl" href="mailto:info@desfeermakers.com?subject=Info via de website">Mail ons nog vandaag!</a>
</div>
"....subject=Info via de website"
Er mogen geen spaties in een href staan.
Is dit niet de oplossing, haal dan alle class'es even weg en kijk dan of de button clickable is.

Een beter en veiliger alternatief voor mailto is PHPMailer (klik)
Google even op: bottstrap 4 phpmailer
 
Laatst bewerkt:
Hier kom ik helaas niet uit, teveel variabelen voor mij om mee om te gaan!
Iemand een concrete oplossing met het stukje aangepast script dat ik dien aan te passen?

Een contact form hoeft het voor mij niet te zijn, ik vul die dingen zelf ook niet graag in nml.
 
Even gekeken, het zit op zeker in business-casual.min.css want als ik die regel even weghaal werken de knoppen goed.

** eidt: De boosdoener is position:absolute bij .cta .cta-inner:before {...}

Een telefoon button in jouw html gaat zo
Code:
<span class="small"><em>Bel ons</em></span>
<br><a class="btn" href="tel:06-1101-8111">06 1101 8111</a>
Je bent een </div> vergeten vlak boven </section> van de eerste sectie.

Suc6. Have fun.
 
Laatst bewerkt:
Helaas , geen succes? Daar waar iets niet exact benoemt is raak ik al snel de weg kwijt, regel nr... dat snap ik maar eerste sectie, dat is al wat lastiger. In ieder geval, nog steeds geen bel en mail knop te klikken.
 
Een sectie staat in de html als <section> , het woord lijkt er best veel op ;)
Code:
<section class="page-section cta">
.....
</section>
Er zijn 2 van dergelijke sectie blokken. Bij de eerste sectie mist op de regel direct boven </section> een </div>

Het andere wat je niet kan vinden staat in bestand css/business-casual.min.css
Zoek naar: .cta .cta-inner:before {
Iets erna staat position:absolute . Als je die weghaalt werken de buuttons goed.

Gebruik je Notepad++ om de html en css te wijzigen, doe dan Ctrl+F (zoeken) dan vind je het vanzelf.
 
Laatst bewerkt:
Perfect, de mail knop werkt en de tel. knop ook,dankjewel voor de heldere uitleg
Hoppa!
 
Laatst bewerkt:
Alles perfect opgelost, dankjewel voor de hulp, hier mag een slotje op!
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan