Jump to content

Archived

This topic is now archived and is closed to further replies.

colbystream

MediaBox on Homepage, extend margin

Recommended Posts

colbystream    0
colbystream

Heya,

 

I'm trying to extend the mediabox on my homepage (arcadianporch.com -- "An evidence based..." yada yada) to the left and to the right, as I've done with the navbar. I've already been able to move it up with the code:

 

.mediabox {

   margin-top: -54px;

}

 

and sticking "mediabox" in the styling classes section. But I don't get any movement for left or right margins.

 

I know I can just make the entire page wider, but I don't want a wider length on deeper pages. Any solutions would be phenomenal.

 

Thank you,

~Colby

Share this post


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

HI Colby,

 

The NavBar is full width by default ? Also, I can't see any menu items in your navigation ? Therefore, I am not entirely sure what it is you're trying to achieve?

 

Also, you should never position any element with negative margins, as it can cause all sorts of problems. So if you can provide a concept image of what it is you're trying to achieve we may be able to assist.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
colbystream    0
colbystream

Hi Danny,

 

You couldn't see any menu items because of the negative margins. Fixed that; I see what you mean. I can make the site full width and go all the way to the edges. Just means that if I don't want elements going full width, I have to design them that way for individual pages.

 

I do have another question re:negative margins. If I shouldn't use those, what code should I use to get rid of white space? Notice on the homepage that the navigation doesn't reach the top of the screen (there's white space). And that there's also white space between the navigation and the blue box. My way of fixing this was to use negative margins. Is there a better way?

Share this post


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

To remove those gaps, you will want to reduce the padding in the Sections options, there are two padding top and padding bottom. When you remove this padding for that section area, it will close the gap.

 

https://cloudup.com/cLVmg_BaBB4

 

Also, see this tutorial on our docs, it may assist you, as it looks like this is what you're trying to achieve, different background colors for different sections - http://docs.pagelines.com/tutorials/section-area-styling


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
colbystream    0
colbystream

Hey Danny,

 

So I changed the padding on both sections to 0px, still getting a small bit of white space. How do I remove that?

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there, I can't see any white space on the left or the right - http://screencast.com/t/j7JomFxdwg4

 

If you mean the white space at the top, thats coming from the navbar sectionpad, 5px on top and bottom - http://screencast.com/t/TQs5BIUvhp


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
colbystream    0
colbystream

Thank you, both. That last bit is what I needed to know. Got the correct code in and all fixed.

 

Thanks again!

Share this post


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

Thanks for informing us the issue has been resolved.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • triggerfish
      By triggerfish+
      Media Box not taking Google Maps input
      I have the EMBED MAP code from Google (which I have done 100''s of times before),
      I input it into the TEXTBOX or MEDIABOX SAVE it, and as soon as I refresh the page the text is gone (and of course there is no map).
      I have rebooted, refresh cache, everything with no luck..it just will not take the google maps input...it will however take and save a simple text input.
      I am using WordPress 4.5.1
      DMSVersion: 2.2.1.1
      The google code is:
      <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2602.466376170749!2d-123.11645494869879!3d49.286507879230314!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x548671828dbf1c61%3A0x489cbb919c49d6e!2s325+Howe+St%2C+Vancouver%2C+BC+V6C+3N2!5e0!3m2!1sen!2sca!4v1461869255884" width="800" height="600" frameborder="0" style="border:0" allowfullscreen></iframe>
      The website and CONTACT PAGE ( the map is next to the CONTACT VALRI text, there is a textbox and media box there) are here:
      http://valufitness.com/contact-us/
      Your login is:
      http://valufitness.com/val-login/
      USer= ***
      pass= ****
       
    • amb62137
      By amb62137
      Hi there,
      I am trying to change an image on hover using either MediaBox or TextBox. The image is manually inserted using the HTML box. 
    • pagelines_45
      By pagelines_45
      I am trying to remove the bottom padding from a media box.  When I inspect and change the value it works but I can not for the right css section names to change it in either the page css or custom code area.  I have even tried custom style for the page, but no luck.  Here is the site http://wordpress.howard-boats.com/  on the home page I am trying to get the wide sailboat image to touch the foot.  bottom-padding:0px  but I cant get it to work.  Thank you for your help I'm sure I am doing something stupid.
       
      David
       
    • mundocaco
      By mundocaco+
      Hello, inexplicably few signs have appeared at the beginning of each excerpts, removing the option these signs disappear, but appear when I activate it again. You know why happen this?.
       
      Yo can see online here: http://www.latitudestudio.eu/press-news/ 
       
       
    • dherries
      By dherries
      I am trying to add a widgetizer to my page/post and the system does not let it drag. The system creates  large Widgetizer logo and nothing will happen. What am I doing wrong?  I am using DSM 1.1.9.  Website is www.moveincache.com
×