Hallo,
Ik heb voor iemand een simpele website gemaakt met Artisteer 4 maar er zijn allerlei problemen om het op verschillende monitoren, smartphone e.d. goed zichtbaar te krijgen. Op een 25"monitor ziet alles er goed uit, op een 17" monitor verdwijnt een deel van de site aan de rechterkant op een smartphone gaat het menu boven de foto zitten en ga zo maar door.
Op jullie site heb ik gevonden dat een website tegenwoordig responsive moet zijn voor dit soort problemen, ik heb gezocht maar de website is door Artisteer responsive gemaakt. Ik heb zelfs een stuk html gevonden waar zoiets in staat. (zie onder) Ik heb totaal geen verstand van html maar heeft iemand een idee hoe dit probleem op te lossen is ? Ik blijf aan het experimenteren maar zonder suc6...
De website is htdam.nl
Bedankt alvast !
groeten,
Hans
Code:
/* Created by Artisteer v4.0.0.58475 */
.responsive body
{
min-width: 240px;
}
.responsive .art-content-layout img,
.responsive .art-content-layout video
{
max-width: 100%;
height: auto !important;
}
.responsive.responsive-phone .art-content-layout img
{
float: none !important;
}
.responsive .art-content-layout .art-sidebar0,
.responsive .art-content-layout .art-sidebar1,
.responsive .art-content-layout .art-sidebar2
{
width: auto !important;
}
.responsive .art-content-layout,
.responsive .art-content-layout-row,
.responsive .art-layout-cell
{
display: block;
}
.responsive .art-slidenavigator
{
display: none !important;
}
.responsive .art-collage
{
display: none !important;
}
.responsive .image-caption-wrapper
{
width: auto !important;
}
.responsive .art-textblock
{
display: none;
}
.responsive.responsive-tablet .art-vmenublock,
.responsive.responsive-tablet .art-block
{
margin-left: 1%;
margin-right: 1%;
width: 48%;
float: left;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.responsive .art-responsive-embed
{
position: relative;
padding-bottom: 56.25%;
/* 16:9 */
height: 0;
}
.responsive .art-responsive-embed iframe,
.responsive .art-responsive-embed object,
.responsive .art-responsive-embed embed
{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.responsive .art-sheet
{
width: auto !important;
min-width: 240px !important;
max-width: none;
margin-right: 1% !important;
margin-left: 1% !important;
margin-top: 1% !important;
}
#art-resp {
display: none;
}
@media all and (max-width: 999px)
{
#art-resp, #art-resp-t { display: block; }
#art-resp-m { display: none; }
}
@media all and (max-width: 480px)
{
#art-resp, #art-resp-m { display: block; }
#art-resp-t { display: none; }
}
.responsive .art-content-layout,
.responsive .art-content-layout-row,
.responsive .art-layout-cell
{
display: block;
}
.responsive .art-layout-cell
{
width: auto !important;
height: auto !important;
border-right-width: 0 !important;
border-left-width: 0 !important;
border-radius: 0 !important;
}
.responsive .art-content-layout:after,
.responsive .art-content-layout-row:after,
.responsive .art-layout-cell:after
{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.responsive .art-post
{
border-radius: 0;
}
.responsive .responsive-tablet-layout-cell
{
width: 50% !important;
float: left;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
Edit Astrid: Ik heb de code tussen codetags geplaatst, volgende keer graag zelf doen.
Heeft onderwerp gestart
