CSS Question: Margins without Borders...

User 10077 Photo


Senior Advisor
1,095 posts

I have a class assigned to [body] called grid-1.


body.grid-1 {
max-width: 980px;
background-color: #fff;
}

.grid-1 {
border-left: 1px solid #003300;
border-right: 1px solid #003300;
border-top: 1px solid #FFFFFF;
border-bottom: 0px solid #003300;
}


If I don't put a border on the top, it automatically puts a margin at the top of the page. If the border is there, it bumps right up against the top of the page just like I want it. Why does this happen and is there another way to fix it that doesn't require borders?
ASK ME ANYTHING
I provide personalized help for Coffeecup Users including training for Site Designer and Web Form Builder via Zoom.
Email me at support@usconsumernet.org or call 865-687-7698.

Did you know that Web Form Builder can be used for both simple and complicated forms and that it's not limited to the default fonts and buttons? Take a look at a form we developed for WindowTinting.com.
https://forms.windowtinting.com/forms/w … ppingcart/
User 2484360 Photo


Registered User
3,293 posts

Hey Brian,

We would need to see the website to make a determination on what the issue could be. Can you provide a link to the page in question? :)
User 271657 Photo


Ambassador
3,816 posts

Brian, have you tried removing the margin?
margin-top: 0;
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 10077 Photo


Senior Advisor
1,095 posts

I removed the borders so you can see what I'm talking about.

http://bfseal.com/
ASK ME ANYTHING
I provide personalized help for Coffeecup Users including training for Site Designer and Web Form Builder via Zoom.
Email me at support@usconsumernet.org or call 865-687-7698.

Did you know that Web Form Builder can be used for both simple and complicated forms and that it's not limited to the default fonts and buttons? Take a look at a form we developed for WindowTinting.com.
https://forms.windowtinting.com/forms/w … ppingcart/
User 2484360 Photo


Registered User
3,293 posts

Brian Durfee wrote:
I removed the borders so you can see what I'm talking about.

http://bfseal.com/


I am not sure I see the issue here. There is no top margin applied to the body or grid-1.

What are you trying to accomplish?
User 10077 Photo


Senior Advisor
1,095 posts

There is a gap of orange between the white body and the top of the window. I want the body to be up against the top of the window. Normally, I'd just set the margin to 0, but that doesn't seem to work in this case. If I add a top border, the body moves up against the top of the window so that there is no orange gap.
ASK ME ANYTHING
I provide personalized help for Coffeecup Users including training for Site Designer and Web Form Builder via Zoom.
Email me at support@usconsumernet.org or call 865-687-7698.

Did you know that Web Form Builder can be used for both simple and complicated forms and that it's not limited to the default fonts and buttons? Take a look at a form we developed for WindowTinting.com.
https://forms.windowtinting.com/forms/w … ppingcart/
User 2273654 Photo


Registered User
754 posts

I am just guessing, I have not used the RLM yet but I am thinking that it was positioned with the borders in the initial RLM set up and you would have to go back and position it again with the RLM without the borders and then import it again to get it to appear where you want it to.
My CC S-drive site https://workhorsepainting.com
User 10077 Photo


Senior Advisor
1,095 posts

GregB, you gotta get RLM. Awesome product!

I did not add borders in RLM. The issue is that there is a gap between the top of the body and the top of the window (that shows the orange background). The only way that I've found to get rid of it is to add borders to the body. I'm wondering why that is and if there is another solution to eliminate the gap.
ASK ME ANYTHING
I provide personalized help for Coffeecup Users including training for Site Designer and Web Form Builder via Zoom.
Email me at support@usconsumernet.org or call 865-687-7698.

Did you know that Web Form Builder can be used for both simple and complicated forms and that it's not limited to the default fonts and buttons? Take a look at a form we developed for WindowTinting.com.
https://forms.windowtinting.com/forms/w … ppingcart/
User 187934 Photo


Senior Advisor
20,181 posts

Can you share your .rlm file?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 271657 Photo


Ambassador
3,816 posts

Quite the mystery there :o
Is there some body positioning option somewhere?
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.