Pagina over de hele breedte van het scherm

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Peet Peterse

Peet Peterse

17/01/2020 16:49:29
Quote Anchor link
Beste collega,

Ik heb een site bij ccvshop waar ik enigziens de css en sommige templates bestanden kunnen wijzigen (wat ik liever niet zomaar doe)

Bijna mijn alle paginas zijn iets van 2/5de van de scherm breed, ik verlies dus een hoop ruimte zowel aan de linke als de rechte zijde.

ik kan volgende bestanden inzien een aanpassen:

index.tpl
template.css
Scripts.js
Dictionary.sub.tpl

ProductCategory1.sub.tpl
ProductCategory2.sub.tpl
ProductCategory3.sub.tpl
ProductCategory4.sub.tpl

SubCategory1.sub.tpl
SubCategory2.sub.tpl

ik zie bij template.scc onderstaande code:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
@media (max-width: 992px) {
    .sidebar-offcanvas {
        float: none;
        display: block;
    }
}

@media (min-width: 992px) {
    input#SearchField,
    input#SearchField2 {
        width: 280px !important;
    }
    }

@media (min-width: 1200px) {
    input#SearchField {
        width: 320px !important;
    }
}

@media (max-width: 992px) {
    .martoni-login-topbar .login-label {
        display: none;
    }
    .martoni-search {
        float: none !important;
        position: relative;
        margin-top: 10px;
    }
    .martoni-left-nav {
        margin-bottom: 30px;
    }
}

@media (max-width: 767px) {
    .martoni-language,
    .martoni-usp,
    .martoni-login,
    .martoni-ft-powered {
        display: block;
        text-align: left !important;
        float: none !important;
        margin: 0 !important;
        padding-bottom: 5px;
    }
    .martoni-login {
        left: 0;
    }
    .martoni-search-button {
        right: 0 !important;
    }
}


Sorry voor mijn lange verhaal maar wou het wat duidelijker neerzetten.

Graag zie ik jullie hulp tegemoet.

Alvast bedankt voor de moeite.

Ward:
Titel en [code][/code]-tags aangepast.
Gewijzigd op 17/01/2020 17:02:52 door Ward van der Put
 
PHP hulp

PHP hulp

19/03/2024 04:43:10
 
- Ariën  -
Beheerder

- Ariën -

17/01/2020 16:55:17
Quote Anchor link
Ik vermoed dat er een container-element in je index.tpl staat, welke je met CSS de juiste breedtte kan maken.

PS: Kan je jouw code tussen code-tags zetten?
Gewijzigd op 17/01/2020 16:56:07 door - Ariën -
 
Peet Peterse

Peet Peterse

17/01/2020 17:47:34
Quote Anchor link
Dag Arien,
Ja ik kan alle bovengenoemde bestanden aanpassen, opslaan en laten uitvoeren, althans zonder fout in de nieuwe code anders de site gaat er onderuit.
Ik heb al een backup van deze bestanden dus maak me geen zorgen.
Heeft u een suggestie hoe het moet?
Alvast bedank
 
- Ariën  -
Beheerder

- Ariën -

17/01/2020 17:55:01
Quote Anchor link
Is er geen sandbox-mode? Je wilt immers niet live werken ;-)

Laat de relevante code eens zien over de opbouw van je site. En als het kan ook een URL.
 
Peet Peterse

Peet Peterse

17/01/2020 17:55:33
Quote Anchor link
hier ssn stukje code uit Index.tpl
er wordt met pixels gewerkt.

#navbar {
display: block;
margin-bottom: -15px !important;
}

.col-md-9 .img-container1,
.col-md-9 .img-container2,
.col-md-9 .img-container3,
.col-md-12 .img-container1,
.col-md-12 .img-container2,
.col-md-12 .img-container3,
.col-xs-12 .img-container1,
.col-xs-12 .img-container2,
.col-xs-12 .img-container3 {
height: 380px !important;
}

Toevoeging op 17/01/2020 17:57:27:
Gewijzigd op 18/01/2020 12:24:23 door Peet Peterse
 
- Ariën  -
Beheerder

- Ariën -

17/01/2020 18:22:29
Quote Anchor link
Blijkbaar wordt er gebruik gemaakt van een grid-framework, zoals Bootstrap. Dan kan je met de juiste classes je grid-'table' aanpassen.
 
Peet Peterse

Peet Peterse

17/01/2020 21:53:47
Quote Anchor link
ja sorry met pixel bedoelde ik Grid.
maar hoe en waar kan ik het doen, heb je enig idee Arien?
 
- Ariën  -
Beheerder

- Ariën -

17/01/2020 22:54:51
Quote Anchor link
Maak van:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
class="container"


dit:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
class="container-fluid"


En je pagina wordt over de hele breedte getoond.
Gewijzigd op 17/01/2020 22:55:01 door - Ariën -
 
Peet Peterse

Peet Peterse

18/01/2020 12:23:58
Quote Anchor link
Beste Arien,
Dank voor je reactie, het werkt perfect.
Fijne dag verder :P)

Toevoeging op 19/01/2020 02:04:16:

beste arien,
kan de breedte van mijn scherm ietsje kleine worden bv zoals deze site:
https://www.maxshopping.nl/slapen/
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.