Jump to content
stefanoferruggiara

Layout Not Working Well

Recommended Posts

stefanoferruggiara    5
stefanoferruggiara

Hi, i have this problem.. i would like to use all the width of a web page.. i sey 1340 pixel and full width section.. but, looks like the allignment in not centred.. is less on the left that on the right and more...


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

The site target/example is this http://derrenbrown.co.uk mine have to be similar in layout.. then full widht etc...


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
Rob    547
Rob

It appears that there's some error, somewhere.

 

The solution is below, but you'll need to examin your own custom CSS to find out if you've added some conflicting code.

 

#boxes .content-pad {
    margin: auto -10px auto 25px;
    padding-bottom: 5px;
}

You may need to adjust accordingly, and this may vary from one browser to another. 

  • Like 1

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

I've tried to take off all custom code but doesnt change Rob.. and also the width is not perfect like the site i posted.. let me know something.. i send you via email the access if you want. Let me know.. Thanks


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

But is not normal that i have to adjust... centered is centered in not absolute.. is relative then you talking about what?

There isn't a way to have simply centered. The box and the footer columns too..


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

This is my css code:

 

 

body{}
 
#header.container-group {background: black;}
#footer {background: black;}
#site #page, #site #dynamic-content {background: balck;}
 
.pl-imageframe a:hover img {
background: none repeat scroll 0% 0% rgb(143, 6, 6);
}
 
.navbar .navline > li.current-menu-item > a {
background-color: rgba(0, 0, 0, 0.1);
color: #f76600;
text-decoration: none;
}
 
.navbar .navline > li > a:hover {
background-color: rgba(0, 0, 0, 0.1);
color: #f76600;
text-decoration: none;
}
 
body.fixed_width #page {
padding-top: 38px;
}
 
body.navbar_fixed .page-canvas {
padding-top: 0px;
}
 
#site #page .page-canvas, #site #dynamic-content .page-canvas {
margin: 0 auto;
}
 
a.button, button.button, input.button, #review_form #submit {
color: black !important;
background: #f76600;
padding: 6px;
line-height: 1em !important;
margin: 4px 2px 0 0;
float: left;
font-size: 16px !important;
width: auto !important;
vertical-align: middle !important;
text-align: center;
text-decoration: none;
border: none;
cursor: pointer;
font-family: inherit;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
 
input[type="submit"], .submit, input[type="button"], .button, input[type="reset"], .reset {
padding: 4px 9px;
cursor: pointer;
text-decoration: none;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
-ms-box-sizing: content-box;
box-sizing: content-box;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
color: black;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
border: 1px solid #BBB;
background-color: black;
background-image: -moz-linear-gradient(top,white,#f76600);
background-image: -ms-linear-gradient(top,white,#f76600);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(gainsboro));
background-image: -webkit-linear-gradient(top,white,#f76600);
background-image: -o-linear-gradient(top,white,#f76600);
background-image: linear-gradient(top,white,#f76600);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc', GradientType=0);
box-shadow: inset 1px 1px 0px white;
font-family: "Helvetica", Arial, serif;
}
 
.gform_wrapper textarea {
    outline-style: none;
    font-size: 15px;
    font-family: inherit;
    letter-spacing: normal;
    padding: 2px 0px;
    resize: none;
}
 
.gform_wrapper select {
font-size: 15px;
font-family: inherit;
padding: 3px 0 3px 0;
letter-spacing: normal;
}
 
.widget .widget-title {
color: #f76600;
text-align: left;
padding: 3px 8px 3px 0px;
margin-bottom: .6em;
}
 
.gform_wrapper input[type="text"], .gform_wrapper input[type="url"], .gform_wrapper input[type="email"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="number"], .gform_wrapper input[type="password"] {
outline-style: none;
font-size: 15px;
font-family: inherit;
padding: 2px 0 2px 0;
letter-spacing: normal;
}
 
body.home .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.page-id-362 .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.page-id-1446 .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.page-id-680 .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.page-id-112 .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.page-id-572 .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
body.category .content {
        background: none repeat scroll 0 0 transparent !important;
        margin: 0 auto;
        position: relative;
        width: 100%;
}
 
.category-23 #dynamic-content  { background: #bcbcbc;}
 
#featurenav a.activeSlide {
background: #f76600;
color: rgba(0, 0, 0, 0.7);
}
 
#featurenav a {
margin: 0 8px 4px 0;
padding: 1px 10px 0;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
background: #BCBCBC;
display: inline-block;
font-size: 12px;
line-height: 20px;
text-align: center;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.2);
color: rgba(0, 0, 0, 0.7);
}
 
#feature_slider .fcontainer .feature-wrap.bg_cover {
background-position: center center;
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.9), 0 1px 0 rgba(0, 0, 0, 0.9);
border-radius: 3px;
}
 
.pl-imageframe img, img.pl-imageframe {
    padding: 4px;
    background: none repeat scroll 0% 0% rgb(182, 182, 182);
    border: 1px solid rgb(182, 182, 182);
    -moz-box-sizing: border-box;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
    border-radius: 3px 3px 3px 3px;
}
 
#eventlist .weekday {
font-size: 0.9em;
text-transform: uppercase;
color: black;
}
 
 
#eventlist .start-date, #eventlist .end-date {
text-align: center;
color: black;
}
 
#branding {
    .mainlogo-link, .mainlogo-img{margin:0 auto;float:none;}
}
 
/* Centered Navigation */
#page {
  #navbar,
  #nav{
    .navline,
    .main-nav{
      float:none;
      text-align: center;
      li {
    display:inline-block;
        float:none;
        text-align:center;
      a {
        float:none;
        text-align:center;
      }
      }
    }
    .dropdown-menu {
        text-align:left;
    }
  } 
}
/* Centered Navigation Media Query*/
@media(max-width:767px){
body.pagelines {
  #page {
     #navbar {
        .navline {
          float:none;
          text-align:left;
          li,a {
            display: block;
            float: none;
            text-align: left;
          }
        }
      }
    }
  }  
}
 
body.fixed_width #page {
padding-top: 0px;
}
 
#page #navbar .navline li a, #page #navbar .main-nav li a, #page #nav .navline li a, #page #nav .main-nav li a {
    float: none;
    text-align: center;
    font-size: 1.3em;
}
 
.main-nav li a,#navbar li a {font-weight:bold;}
 
.main_nav ul li a {
    line-height: 1em;
    padding: 8px 15px;
    text-decoration: none;
    display: block;
    border-width: 1px 1px medium;
    border-style: solid solid none;
    border-color: transparent transparent -moz-use-text-color;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
}
 
#footer li.link-list a, #footer .widget-title {
color: white;
}

"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

First of all please do not paste all custom CSS into your post, if its more than one small snippet then use our pastie service.

 

http://paste.pagelines.com/

 

Secondary, your site is all centered - http://i.imgur.com/LnvHQ.png

 

I added a red background to your content area and this shows your site in my opinion is centered correctly.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

This is the ABOUT page not the HOME Page... i'm talking about HOME Page and specially the BOX and the footer columns.


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

To my point of view Danny... but is just my point of view.. this you cant call centered.

See screen here please cause i dont know how upload in post:

https://www.dropbox.com/s/mmb1z4uxzyjl6fu/Screen.jpg

 

One is Chrome one if Firefox


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

The footer is the same regardless of the page, the homepage is also centered. I am not sure why you think otherwise. The columns are aligned to the left but each footer column when using is four of them are 25% in width, your footer columns are aligned to your site.

 

If you wish to have your text centered then use the following code.

 

 

 

#site .pprow {
text-align: center;
}

Also please stop reporting this as a bug to our helpdesk, it is not a bug.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
batman    389
batman

Hi Stefano

Please try with

  .top_thumbs .fboxgraphic, .only_thumbs .fboxgraphic {     margin-left: auto;     margin-right: auto;}

 

Uuupsss I don´t see the danny´s reply, try this first

:)


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

Yes ... Danny sorry.. the footer is the same but you see the image? The box is not centered..


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Ok, here is the code you have used in your text widget to display you image.

 

 

<a href="http://www.stefanoferruggiara.com'>http://www.stefanoferruggiara.com"><img class="alignleft size-full wp-image-1627" title="" src="http://www.stefanoferruggiara.com'>http://www.stefanoferruggiara.com/wp-content/uploads/2012/11/SFLOGOFOOTER.jpg" alt="" width="115" height="100"></a>


As you can see you have the class alignleft, please remove this and add center instead. So it looks like this:

 

 

 

<a href="http://www.stefanoferruggiara.com'>http://www.stefanoferruggiara.com"><img class="center size-full wp-image-1627" title="" src="http://www.stefanoferruggiara.com'>http://www.stefanoferruggiara.com/wp-content/uploads/2012/11/SFLOGOFOOTER.jpg" alt="" width="115" height="100"></a>

 

Which will look like this:

 

http://d.pr/i/XG7q


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

Thanks, and not the foto box in the footer but the box feature just down my image is not centered.


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
batman    389
batman

Hi Stefano

Do you add this ? 

  .top_thumbs .fboxgraphic, .only_thumbs .fboxgraphic {     margin-left: auto;     margin-right: auto;}

To center the image...


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
Rob    547
Rob

Stefano,

 

A note on Bug Reports.  Let me be perfectly clear that each time in past that you've reported bugs they turned out to be coding errors on your part and not a bug.  Such reports take critical time away from our staff to research the report, since we take bug reports quite seriously.  Falsely reporting bugs because you can't find your own coding errors is not proper and will be dealt with in the most severe terms.  You've been warned. Doing this again and your forum privileges will be removed for 30 days.

 

You really need to use validators for your custom code and not post volumes of CSS or HTML here.  We are not going to spend our time reading or fixing your customization errors.  That is not what the forum is for.  A CSS Validator may be found here. Use the Direct Input tab.   An HTML Validator is found here.

 

Please bookmark and use those links BEFORE using this forum to resolve your errors.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

But when i found error in the code .. if is note Jigoshop or something else ... how i can fix if is not a part of the custom code that i have put.

If i made some error is cause, like you know very well, i'm not technical and then.. when i do by my self, i human and not technical and i made some error.. if i take of all my custom code.. how i can resolve my problem???

I need to reinstall all??? I will do if is necessary.. but if some technical help me i don't have to do.

Tell me...

I can use the like you give me but i don't know what i have to do with the response i receive from the validation.. then??? Explain to me what i have to do .. if i have a problem and i need some technical that can help me to resolve.


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

I reinstall all.. wp and all.. after i dont put any custom code ... and i made the validation at the link you give me.. i want to see if return me any error.. if yes where i can share the result cause in this case can be only the Theme and Pagelines Plugin. And after where and how i have to ask about support... here? via mail? with the support form?

Let me know.

Thanks.


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

OK ... just reinstalled all.. new DATA BASE now WP.. new all.. no plugin activated ... no css

At your link htlm valitation this thema have 963 ERROR and for W3C 3 Critical Error... now .. yesterday i receive a warning for what!!! Now it's me that i'm crazy??? i lost time and money.. who give me back? now i dont have my site on line cause i have to rebuild again.. who fix this 963 error that the cause is not me... view that i have just reinstalled all new?!!


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Stefano, I apologise but I don't understand your post above, are you saying that on a fresh install you encounter 963 HTML errors ? 


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
stefanoferruggiara    5
stefanoferruggiara

Hi there,

yesterday i was talking about some problem that i found with my site, about layout setting and some feature that is not centered.

Robert give me 2 link for validate html and w3c cause he talk about some error that maybe i do customizing css code.. I have reinstalled all.. and without plugin and css code Pageliens Framework Theme return 933 error html and 3 critical error with W3C. No one reply to me and i'm still waiting with now my site off line and to made as new.

 

Today i build a site for a client and the box (core plugin box) IS NOT CENTERED!! Now i don't think that i lost my view or my browser or css code.. maybe is possible that the section don't center automatically the box dipending on their dimension etc...

 

You can help me to fix the html and w3c error and center the box please?

Thanks for fast reply because i have my site off line caused to this problem..

 

I think that.. is not correct that I have the site off line just because I have reinstalled everything cause I believe i have done something wrong, and instead is the theme or plugin that has some bug or setting to fix. Please now, in light of the fact that it was not a plugin or my css code, after receive a warning unfair because I had every reason to be angry, please help me to put my site online without errors and with the correct aspect.

 

The site of my client is http://studiofalcicchio.com see the box here. and also this site try to validate with html and w3c and you can see how many error have pageliens framework due to original installation and not cutomization code or plugin.

 

my site is: http://stefanoferruggiara.com


"Se c'è una sola possibilità.. lo faccio, se non c'è.. la creo!"

Coach Stefano Ferruggiara, Allenatore Fisico & Mentale

Share this post


Link to post
Share on other sites
beardedavenger    158
beardedavenger

As Catrina noted, I would start deactivating all plugins and sections. My personal site, running on PageLines, full validates.

 

http://validator.w3.org/check?uri=http%3A%2F%2Fnickhaskins.com&charset=%28detect+automatically%29&doctype=Inline&group=0

 

Also, the box section images are not shipped with a center aligned box image, however it's very easy to do with CSS.


Something big is coming for DMS + photographers.

http://fotostheme.com

 

Nick Haskins & CO - New home for all of my PageLines Store products! 

http://nickhaskins.co

 

Better DMS - News, Tutorials, and Tips

http://betterdms.com

 

Share this post


Link to post
Share on other sites
Simon    247
Simon

The boxes are not aligned left, right or centered. Thats up to you the designer to align them. If we aligned them to the center someone else would complain that they are hard coded centered and they want them aligned to the right or left.

 

As for the validation, all those errors are browser 'hacks' in bootstrap for internet explorer.

 

Please stop opening multiple posts on the same topic.

 

Merging this post into the other one.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Similar Content

    • Anthony King
      By Anthony King+
      I have to say that I like the Layout and the Template based sections. Some of them are really impressive.
      One of the things that I would like to request though is the possibility of being able to dynamically rearrange the layout.
      An example of what I am talking about is take the Agency Section. It's current layout starts with the
      Splash Module then the Portfolio Module then the Service Module and so on and so forth.
      What would be great is if we were able to move these modules around. I.e have the Service Module first
      then maybe the Splash, and then the portfolio.
       
    • Queue-it
      By Queue-it+
      Hi,
      Is is possible to have different layouts for different Post categories? We have Blog posts, News posts and Case studies that all are posts, but is it possible to differentiate their layouts?
      So far when I change a post layout it affects all Post type pages. Could it be done somehow with creating a separate template? 
      Examples below
      https://queue-it.com/news/
      https://queue-it.com/blog/
       
    • huskers2011
      By huskers2011+
      Although my layout in edit view is correct, when I look at the page the layout is wrong. I have moved the sections around and the layout remains the same when I view it. Im using 
       PageLines Platform 5 - v5.0.162 running a Pageline theme &  Wordpress version 4.6.1
      The page is http://kwamedawes.com/speak-from-here-to-there-the-dialogue/ the section order is incorrect. and
      http://kwamedawes.com/speak-from-here-to-there-the-poems/ top section is laid out like the bottom section, but displays as shown.
       
      Thanks for any help.
      Lorna
    • tforasiepi
      By tforasiepi+
      My client is asking for a new blog layout similar to the one found here:  http://blog.perkinswill.com/pokemon-augmented-reality-and-the-future-of-urban-design/ 
      They have a splashy full-width background image overlaid with part of the blog and one sidebar.  The navigation arrows send you to the next post.
      Does anyone know if this is even possible using Framework 5?  If so, can you send me some advice on how to get here?
      Totally stuck!
      Thanks.
    • aldisney
      By aldisney+
      Hi--
      I'm having some trouble understanding how to use the Page Layouts; I want to create a single landing page which does not include navigation or any content from other pages. However, whenever I use the Landing Page template (which is not attached to any other page in the site), and I set the Page Setup to Local, all of the changes I make to the navigation, header, footer, etc., continue to propagate throughout the entire rest of the site. What am I doing wrong? I've already now wasted hours having to rebuild areas for the rest of the site, so I'm a little hesitant to make any more changes.
       
      On a side note, this area of PageLines really could use some work, both in terms of documentation and in terms of UI/UX. It's a pretty reasonable assumption for a user to make to create a new template, set it to Local, and expect that those changes would not impact the rest of the site. 
×