University Web Developers

University Web Developers

I am having the hardest time making margin settings stick in Firefox.

I have used :
div#container {
margin-left: auto;
margin-right: auto;
width: XXpx;
}

and it just doesn't seem to work.

I have also tried setting my margins to zero. I have other isssues with CSS but this is the one that is bugging me the most right now. I have been forced to do some very ugly things to get my margins to act right.

Can anyone help?!?

Views: 91

Replies to This Discussion

Are you trying to centre #container? Try making it's parent element's position either relative or absolute.
Yep, I will post the problem in the next couple of days so that we can look at it together. As you probably seen in the other reply I stuck it in a to show properly. I know - I know.
can you share a link to the page? The problem is probably with the elements around it, more than the code you have. Firefox is usually pretty easy to work with, so it should be very simple to fix.
I have torn the page into pieces. I will try to recreate the problem in the next couple of days. I did something VERY ugly to get it ready to show... are you ready.... I stuck it in a
of a table. I will bring it out of the table and show you guys - thanks for all the help
My work around is having to put both for IE and Firefox. For Firefox I put "!important" after the px and before the ; I found this solution out on the web.

padding-top: 6px;
padding-top: 8px!important;
What does the !important tell the browser?
it says hey do this nomartter what. Kathy's code cancels each other.
Can you say more what you need to do? margin-left/right: auto; is used to center the element. However you need to define a width, unless you set the display to block. By default a div is width:100%. One thing to try is to remove the div from above. Sometimes the browser thinks this says container is a child. So it is looking for
<div>
<div id="container">
</div>
</div>
hi shere hicks...what aer you trying to fix? can you ftp your file so that we could you help you to re-align whatever problems do you have?
To aggregate some of the comments already made, and to add a little bit of information I've found to be helpful in my own use of "margin: auto", here are my thoughts:
1) The div#container has to be a block-level element. If any of your CSS anywhere switched your divs to inline, inline-block or whatever, you will need to explicitly redeclare the fact that div#container should be block
2) An automatic margin only works if you define a specific width for the div. I'm assuming you have done so, since your example has "XXpx" set as the width (I'm hoping you didn't actually use "XX" in your CSS declaration).
3) It is helpful to declare "text-align: center" for the parent node of div#container, then redeclare "text-align: left" for the div#container. That is the only way I've been able to get my container div centered consistently within IE (the auto margin worked just fine for Firefox, but never worked in IE).
4) Make sure you don't have any floats that might be pushing your container in any direction. Floats that are not cleared properly will mess up the margins of your div#container.
5) Just to clarify - you do want div#container to be centered on the page, not something found inside of div#container, right?
To center a div do this:

#container {margin: 0 auto; width:xx px;}

or

#container {margin-left: 0 auto; margin-right: 0 auto; width:xx px;}
could you supply a link to the page? As others have stated it's not entirely clear what your issue is from the code you posted.

The code you have supplied will 100% give you a centered div in the browser window (again as others have said assuming you actually assigned values to xx in the width). Weirdly firefox is one of the browsers that absolutely shouldn't give you any problems on this front (unlike ie6 which benefits from the text-align 'hack' - I say hack but actually the code still validates).

Again as others have mentioned there might be some floating divs causing issues? Try adding clear:both; and see if that changes anything.

RSS

Elsewhere

Latest Activity

Sara Arnold commented on Lynn Zawie's group OmniUpdate
"OmniUpdate is excited to be in the running for a People’s Choice Stevie Award for Favorite Customer Service! If you’d like to show your support, cast your vote now! You can vote as many times as you’d like."
23 hours ago
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Take a ½ hour out of your day to learn 4 important tips on keeping your website accessible! Join Ryan from Paskill Stapleton & Lord @PSandL as he shares the accessibility guidelines for your university website. http://bit.ly/2zhdcIt"
Jan 7
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Get up to speed on GDPR and how it affects your higher ed institution and student recruitment. http://bit.ly/2YZZtRQ"
Jan 7
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Web governance should not be an afterthought; when it’s done right, it can actually enhance your workflow and make your job easier. http://bit.ly/33vIZU0"
Nov 8, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Exciting news... OmniUpdate has merged with Destiny Solutions! Learn more on our blog. http://bit.ly/332KSr8"
Oct 30, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Switching to a new CMS? Join our next webcast with Briana Johnson from @OSUIT to learn how to convince decentralized web content authors to tolerate the switch, actively participate, and enjoy it! http://bit.ly/2zhdcIt"
Oct 29, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Your website is the front door to your college or university. Your website design has to accommodate for the way that students interact with and use the information your institution provides. http://bit.ly/2P8VldR"
Oct 24, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Learn how a new website design and CMS helped Florida Gulf Coast University increase new visits to the school’s website with improved SEO. http://bit.ly/2ByaQq4"
Oct 21, 2019
Profile IconJames Pollard and Michael Clarke joined University Web Developers
Oct 21, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Join our next webcast with Kelly Rushing from @uofsouthalabama to learn how to create accessible PDFs for your website by starting with your source documents. http://bit.ly/2zhdcIt"
Oct 18, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Learn why your college or university should choose SaaS across the board, especially for your next CMS. http://bit.ly/2Iy0SZE"
Oct 8, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Join us for our next webcast with OmniUpdate CEO Lance Merker, who will delve into key insights about Generation Z’s online search behaviors to help you refine your school's web marketing strategy. http://bit.ly/2zhdcIt"
Oct 3, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Our newest guide will help you learn what it means to be accessible, how to implement accessibility best practices, quick fixes to try as well as a long-term plan, plus tools to help you in your website accessibility efforts. Download it now!"
Oct 1, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Are online forms more efficient? Learn how El Camino College used Formstack to create online forms that expedited processing, improved communications, increased transparency, and promoted accountability across campus. http://bit.ly/2zhdcIt"
Sep 18, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"It's important to understand the science behind your web pages to better engage and ultimately attract prospective students to your site. http://bit.ly/2ZYK8FZ"
Sep 12, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"If you’re struggling with web challenges such as accessibility, SEO, design consistency, workflow, content governance, or how to start a website redesign, you’re not alone. Join our next webcast to learn how other higher ed institutions…"
Sep 5, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"eQAfy confirms that OU Campus is still the #1 commercial CMS for colleges and universities in the United States. http://bit.ly/2Lir9Mn"
Aug 28, 2019
Sara Arnold commented on Lynn Zawie's group OmniUpdate
"Here’s an outline of everything you need to know about OCR compliance, including what it is, what your college or university can do to stay compliant, and resources for OCR compliance. #accessibility http://bit.ly/2rcPDgG"
Aug 23, 2019
Linda Faciana commented on Lynn Zawie's group OmniUpdate
"Join us for our next webcast with April Buscher from Montana State University Billings to learn how blind readers and people with hearing impairment view and read your website and how you can make it accessible to them. http://bit.ly/2zhdcIt"
Aug 14, 2019
Amanda Lawson joined Lynn Zawie's group
Thumbnail

OmniUpdate

Share your experiences using OmniUpdate CMS
Aug 9, 2019

UWEBD has been in existence for more than 10 years and is the very best email discussion list on the Internet, in any industry, on any topic

About

© 2020   Created by Mark Greenfield.   Powered by

Badges  |  Report an Issue  |  Terms of Service