executive pro 3 column responsiveness

Community Forums Forums Design Tips and Tricks executive pro 3 column responsiveness

This topic is: not resolved

Tagged: 

This topic contains 9 replies, has 2 voices, and was last updated by  Dad 5 months, 1 week ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #102886

    Dad
    Member
    Post count: 12

    Good Afternoon,
    I test on localhost a 3 columns page on executive pro theme and when I change the size of my browser, the colums are not going one under the other one like in the demo. Any idea ?

    Here is my html :

    Rédaction technique / Maintenance / Alignement du SI

     

    <!–more–>
    <h4>IO Software, Conseil en Stratégie et Développement commercial pour les TPE/PME fournit trois types de services informatiques :</h4>
     
    <div class=”one-third first”>Rédaction technique
    Qu’il s’agisse d’un guide utilisateur, d’un guide administrateur ou même de documents extrêmement techniques, nous saurons s’il le faut monter les configurations idoine et rédiger la documentation correspondante. Nous avons une expérience de plus de 20 ans dans la rédaction technique.</div>
    <div class=”one-third”>Informatique de maintenance :
    Nos Services informatiques de maintenance vous permettront de vous affranchir de la gestion de votre parc informatique. Que vous possédiez un ou plusieurs ordinateurs de bureau ou bien un ou plusieurs ordinateurs portables, que vous possédiez une ou plusieurs imprimantes, un réseau local nous nous engagerons à vous garantir le bon état de fonctionnement de votre matériel par des visites régulières de mise à niveau des logiciels ainsi que l’application d’anti-virus, de surf anonyme sur internet, de mise en place d’une sécurité avancée …</div>
    <div class=”one-third”>Informatique d’alignement du système d’information
    De nos jours, l’outil informatique est indispensable à toute TPE/PME qui veut se développer. Le plus souvent par manque de temps, l’outil ou les outils techniques mis en place ne correspondent pas à l’organisation de votre entreprise. Par exemple, vos données commerciales sont enregistrées à plusieurs endroits par plusieurs commerciaux qui gèrent leur portefeuille client. Ne serait-il pas plus simple de n’avoir qu’un seul système de stockage de ces données afin que les informations ne soient pas dupliquées et parfois fausses ?Par exemple, le client X a changé de n° de téléphone. Le commercial concerné met à jour ce numéro dans son fichier client. Par contre, il oublie de le signaler à l’autre commercial qui le remplace pendant les vacances sur ce compte. Comment faire ? Sa machine est verrouillée et il est injoignable.
    Ceci n’est qu’un exemple. L’informatique doit-être agile et pouvoir s’adapter le plus facilement possible aux changements d’organisation qui pourraient subvenir dans votre entreprise. Nous pouvons mettre tout cela en place pour vous.
    Une donnée ne doit être stockée qu’en un seul endroit.</div>
    Mieux vaut prévenir que guérir. Nous saurons également vous conseiller ou choisir avec vous la mise en place de matériel de remplacement du obsolète qui vous fait perdre du temps et assurer les formations indispensables à la prise en mains des nouveaux outils afin d’améliorer votre productivité.

    Vous êtes une TPE/PME et n’avez pas le temps de vous en occuper ? Contactez-nous.

    #102887

    Lauren @ OnceCoupled
    Member
    Post count: 611

    If it’s only breaking when you decrease your browser size, you need to check your style.css’s @media queries. Probably at your smallest screen size they’ll be listed with width:100%;

    Best,
    Lauren


    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    #102894

    Dad
    Member
    Post count: 12

    Thanks Lauren,
    By default in the style.css I have some @media only screen and (max-width: 1023px) with max-width depending on the size screen … I guess … Not very used to. But I use the style.css provided by Studiopress and did not touch that functionality.

    Sample :

    @media only screen and (max-width: 1200px) {

    .site-container {
    max-width: 960px;
    }

    .site-header .widget-area {
    width: 700px;
    }

    .content {
    width: 660px;
    }

    .sidebar-primary {
    width: 300px;
    }

    .title-area {
    width: 260px;
    }

    .breadcrumb {
    margin: -30px -40px 30px;
    margin: -3rem -4rem 3rem;
    }

    .content {
    padding: 30px 40px 10px;
    padding: 3rem 4rem 1rem;
    }

    .site-header .genesis-nav-menu a {
    padding: 38px 14px 40px;
    padding: 3.8rem 1.4rem 4rem;
    }

    .content #genesis-responsive-slider .flex-control-nav,
    .content #genesis-responsive-slider .flex-direction-nav li a,
    .content #genesis-responsive-slider .flex-direction-nav li a.prev {
    display: none;
    }

    #102898

    Lauren @ OnceCoupled
    Member
    Post count: 611

    Without a live site, I really couldn’t say what’s happening. As you say, everything should be working properly!


    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    #102952

    Dad
    Member
    Post count: 12

    Thanks
    I think I will put it online soon and come back to that topic if needed. Best to troubleshoot online for sure with correct devices.

    Many thanks

    Philippe

    #104904

    Dad
    Member
    Post count: 12

    Hello Lauren,

    My web site is online !!!! on a test URL : http://io.io-software.fr.

    You will see that responsiveness is not my best technical skil … :-(

    You have an idea ?

    Kind Regards,

    #104909

    Lauren @ OnceCoupled
    Member
    Post count: 611

    Line 2167 is missing a closing bracket. This will fix your responsiveness!

    Best,
    Lauren


    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    • This reply was modified 5 months, 2 weeks ago by  Lauren @ OnceCoupled. Reason: parenthesis -> bracket
    • This reply was modified 5 months, 2 weeks ago by  Lauren @ OnceCoupled. Reason: parenthesis -> bracket
    #105112

    Dad
    Member
    Post count: 12

    Wow what an eye :-) thanks a lot !!!!
    It fixed everything except the search box I modified a little …..:-(

    Do you know why the logo is not appearing on an iphone ?

    #105114

    Lauren @ OnceCoupled
    Member
    Post count: 611

    Search: when you modified it, you used a very specific selector. This is carrying greater weight than the one in your media queries. http://css-tricks.com/specifics-on-css-specificity/
    You’ll want to add your selector to the media query.

    Logo: I don’t see a logo appearing at any screen size. Probably because the image URL has not been updated.

    Best,
    Lauren


    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    #105125

    Dad
    Member
    Post count: 12

    I fixed the search box.
    Concerning the logo, yes it is on the top left of the web site. This is a pyramid.

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.