473,722 Members | 2,363 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

What is the art of centering a div in the mist of absolute positioning?

Here is the code:

http://cartoper.ueuo.com/centering.htm

How do I get the big blue buttons to center themselves on Firefox and
Safari on this web site?

I know that the layout is a bit complex, but there is a reason for it,
have a look at this site:

http://pahountis.zenfolio.com/p925877948

My final objective is to implement a fluid gallery similar to this
site. The way I am seeing it now, after placing one image div in the
contentAll div, I can use JavaScript to get the size of the contentAll
div and the image div to calculate the total number of images can fit
without them leaving the page. Yes, I know this site uses a ton of
JavaScript. My site will be running in an environment where I am able
to require JavaScript to be enabled.

Cartoper

Sep 30 '07 #1
11 2018
Cartoper wrote:
Here is the code:
Why can't you stick to one thread? If this is too difficult for you,
get a real newsreader and stop using that awful Google Groups interface.

You _are_ aware this is Usenet, not Google, aren't you?

--
-bts
-Motorcycles defy gravity; cars just suck
Sep 30 '07 #2
On Sep 30, 9:56 am, "Beauregard T. Shagnasty"
<a.nony.m...@ex ample.invalidwr ote:
Cartoper wrote:
Here is the code:

Why can't you stick to one thread?
The same exact reason why I will, from time to time, through out code
and start over: Things get old, off topic, and out of context.
Sometimes you simply need to start fresh and new to get new thoughts
and ideas on a subject. I am simply trying to refocus on the real
question at hand, how to center the things I needed centered rather
then focusing on my philosiphy of pixel counting.
You _are_ aware this is Usenet, not Google, aren't you?
There is a chance I have been around the usenet longer then you, don't
know... I have been using Usenet since the early 90's. What I have
found interesting is that the places I have worked over the years
don't allow NTP through their firewall, but they do allow HTTP! That
and how Google (and Deja News back in the day) keeps track of all my
posting, I have simply come to like their interface.

Cartoper

Sep 30 '07 #3
In article
<11************ *********@k79g2 000hse.googlegr oups.com>,
Cartoper <ca******@gmail .comwrote:
Here is the code:

http://cartoper.ueuo.com/centering.htm

How do I get the big blue buttons to center themselves on Firefox and
Safari on this web site?
You have changed the thread. I have looked at B querying this and
I agree, it loses continuity, in particular it loses that you are
unwilling to simplify your html, at the very least to start off
simple and build from there till you strike a problem. I went to
the trouble of making some html and css for you to consider as a
starting point, but what you want seems to be a "fix" for your
present, ie. some minimal thing that will make those blue buttons
move to the centre in FF and Safari (and we might also add: iCab,
Opera and probably other quite good and standards compliant
browsers). You seem not to appreciate that this sort of thing is
actually not very useful if you add the rider that "and the fix
must not have unintended bad consequences". Because, given the
context the fix will be in, ie. your over complicated code, it is
a very difficult to guarantee.

You have a set of blue buttons, one under the other. For each
there is a span surrounded by an anchor surrounded by a div; then
all buttons are surrounded collectively by another div, and the
latter is then surrounded by yet another div and more... The
function and reasoning of all these divs is not really very clear.

OK, you want one thing that will make the buttons all move to the
centre in Firefox. Do this, remove your:

div#main div
{
margin: 0;
padding: 5px;
}

entirely from the css. The absence of this makes them go to the
centre on my machine in FF.

But are we any the wiser really for the future?

--
dorayme
Sep 30 '07 #4
Cartoper <ca******@gmail .comwrites:
On Sep 30, 9:56 am, "Beauregard T. Shagnasty"
<a.nony.m...@ex ample.invalidwr ote:
>Cartoper wrote:
Here is the code:

Why can't you stick to one thread?

The same exact reason why I will, from time to time, through out code
and start over: Things get old, off topic, and out of context.
>You _are_ aware this is Usenet, not Google, aren't you?

There is a chance I have been around the usenet longer then you, don't
know... I have been using Usenet since the early 90's.
In another reply you refer to this as "17 threads" rather than as one
thread with 17 replies. Here, you apparently expect threads to focus
strictly on your question without straying.

Given that you're behaving like a typical usenet newbie, I find your
claims to be a veteran highly doubtful.

sherm--

--
Web Hosting by West Virginians, for West Virginians: http://wv-www.net
Cocoa programming in Perl: http://camelbones.sourceforge.net
Sep 30 '07 #5
On Sep 30, 5:09 pm, dorayme <doraymeRidT... @optusnet.com.a uwrote:
In article
<1191157541.195 255.27...@k79g2 000hse.googlegr oups.com>,

Cartoper <carto...@gmail .comwrote:
Here is the code:
http://cartoper.ueuo.com/centering.htm
How do I get the big blue buttons to center themselves on Firefox and
Safari on this web site?

You have changed the thread. I have looked at B querying this and
I agree, it loses continuity, in particular it loses that you are
unwilling to simplify your html, at the very least to start off
simple and build from there till you strike a problem. I went to
the trouble of making some html and css for you to consider as a
starting point, but what you want seems to be a "fix" for your
present, ie. some minimal thing that will make those blue buttons
move to the centre in FF and Safari (and we might also add: iCab,
Opera and probably other quite good and standards compliant
browsers). You seem not to appreciate that this sort of thing is
actually not very useful if you add the rider that "and the fix
must not have unintended bad consequences". Because, given the
context the fix will be in, ie. your over complicated code, it is
a very difficult to guarantee.

You have a set of blue buttons, one under the other. For each
there is a span surrounded by an anchor surrounded by a div; then
all buttons are surrounded collectively by another div, and the
latter is then surrounded by yet another div and more... The
function and reasoning of all these divs is not really very clear.

OK, you want one thing that will make the buttons all move to the
centre in Firefox. Do this, remove your:

div#main div
{
margin: 0;
padding: 5px;

}

entirely from the css. The absence of this makes them go to the
centre on my machine in FF.

But are we any the wiser really for the future?
dorayme,

I am MUCH wiser. Thank you.

Along with the answer to the question I asked, you also shed some
light on the question I SHOULD have been asking: How do I figure out
what is wrong with my code? You answered it with "to start off simple
and build from there till you strike a problem". Thank you.

Would you mind discussing a little more exactly how you went about
finding the bug? I know from Application development, strong
debugging skills are key to most days goes smoothly, a skill I am
still trying to develop with all this web development stuff;)

Cartoper
Sep 30 '07 #6
In article
<11************ **********@57g2 000hsv.googlegr oups.com>,
Cartoper <ca******@gmail .comwrote:
Would you mind discussing a little more exactly how you went about
finding the bug? I know from Application development, strong
debugging skills are key to most days goes smoothly, a skill I am
still trying to develop with all this web development stuff;)
I just looked at your css and html and could not work out what
the function of so many things were, in particular, the bit I
said to remove.

May I tell you a little story that exhibits a similar banality at
the base of things?

Several centuries ago, the Pope decided that all the Jews had to
leave the Vatican. Naturally there was a big uproar from the
Jewish community. So the Pope made a deal. He would have a
religious debate with the chief Rabbi of the Jewish community. If
the Jew won, the Jews could stay. If the Pope won, the Jews would
leave. The chief Rabbi's Latin wasn't very good - in fact, he
knew very little - but he was a man of great faith and well
respected in the Jewish community. The Pope agreed. What could be
easier than a silent debate?

The day of the great debate came. The Rabbi and the Pope sat
opposite each other for a full minute before the Pope raised his
hand and showed three fingers. The Rabbi looked back at him and
raised one finger. The Pope waved his fingers in a circle around
his head. The Rabbi pointed to the ground where he sat. The Pope
pulled out a wafer and a glass of wine. The Rabbi pulled out an
apple. The Pope stood up and said, "I give up. This man is too
good. The Jews can stay."

An hour later, the cardinals gathered around the Pope asking him
what happened. The Pope said: "First I held up three fingers to
represent the Trinity. He responded by holding up one finger to
remind me that there was still one God common to both our
religions. Then I waved my finger around me to show him that God
was all around us. He responded by pointing to the ground and
showing that God was also right here with us. I pulled out the
wine and the wafer to show that God absolves us from our sins. He
pulled out an apple to remind me of original sin. He had an
answer for everything. What could I do?"

Meanwhile, the Jewish community had crowded around the Rabbi.
"What happened?" they asked. "Well," said the Rabbi, "First he
said to me that the Jews had three days to get out of here. I
told him that not one of us was leaving. Then he told me that
this whole city would be cleared of Jews. I let him know that we
were staying right here." "And then?" asked a woman. "I don't
know," said the Rabbi. "He took out his lunch and I took out
mine."

--
dorayme
Sep 30 '07 #7
On Sep 30, 5:56 pm, dorayme <doraymeRidT... @optusnet.com.a uwrote:
In article
<1191188003.560 614.220...@57g2 000hsv.googlegr oups.com>,

Cartoper <carto...@gmail .comwrote:
Would you mind discussing a little more exactly how you went about
finding the bug? I know from Application development, strong
debugging skills are key to most days goes smoothly, a skill I am
still trying to develop with all this web development stuff;)

I just looked at your css and html and could not work out what
the function of so many things were, in particular, the bit I
said to remove.

May I tell you a little story that exhibits a similar banality at
the base of things?

Several centuries ago, the Pope decided that all the Jews had to
leave the Vatican. Naturally there was a big uproar from the
Jewish community. So the Pope made a deal. He would have a
religious debate with the chief Rabbi of the Jewish community. If
the Jew won, the Jews could stay. If the Pope won, the Jews would
leave. The chief Rabbi's Latin wasn't very good - in fact, he
knew very little - but he was a man of great faith and well
respected in the Jewish community. The Pope agreed. What could be
easier than a silent debate?

The day of the great debate came. The Rabbi and the Pope sat
opposite each other for a full minute before the Pope raised his
hand and showed three fingers. The Rabbi looked back at him and
raised one finger. The Pope waved his fingers in a circle around
his head. The Rabbi pointed to the ground where he sat. The Pope
pulled out a wafer and a glass of wine. The Rabbi pulled out an
apple. The Pope stood up and said, "I give up. This man is too
good. The Jews can stay."

An hour later, the cardinals gathered around the Pope asking him
what happened. The Pope said: "First I held up three fingers to
represent the Trinity. He responded by holding up one finger to
remind me that there was still one God common to both our
religions. Then I waved my finger around me to show him that God
was all around us. He responded by pointing to the ground and
showing that God was also right here with us. I pulled out the
wine and the wafer to show that God absolves us from our sins. He
pulled out an apple to remind me of original sin. He had an
answer for everything. What could I do?"

Meanwhile, the Jewish community had crowded around the Rabbi.
"What happened?" they asked. "Well," said the Rabbi, "First he
said to me that the Jews had three days to get out of here. I
told him that not one of us was leaving. Then he told me that
this whole city would be cleared of Jews. I let him know that we
were staying right here." "And then?" asked a woman. "I don't
know," said the Rabbi. "He took out his lunch and I took out
mine."
I like the story, thanks!

Oct 1 '07 #8
Cartoper meinte:

[snip]
I like the story, thanks!

Still no need to post it as fullquote. *You* should know that.

Gregor

--
http://www.gregorkofler.at ::: Landschafts- und Reisefotografie
http://www.licht-blick.at ::: Forum für Multivisionsvor träge
http://www.image2d.com ::: Bildagentur für den alpinen Raum
Oct 1 '07 #9
dorayme wrote:
In article <ae************ *************** @news.inode.at> ,
Gregor Kofler <us****@gregork ofler.atwrote:
>Cartoper meinte:

[snip]
>>I like the story, thanks!

Still no need to post it as fullquote. *You* should know that.

Yes, I should not have done this and I regretted it.
Gregor was scolding Cartoper, who has claimed to vast years of Usenet
experience but nevertheless reposted your story in full.

That you were sensitive enough to reply with a URL and an (implied)
apology speaks to _your_ Usenet experience (and courtesy).
--
John
Pondering the value of the UIP: http://improve-usenet.org/
Oct 1 '07 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

14
2477
by: Harlan Messinger | last post by:
What am I not understanding about the definition of { position: absolute; }? "The box's position (and possibly size) is specified with the 'left', 'right', 'top', and 'bottom' properties. These properties specify offsets with respect to the box's containing block." Please take a look at http://gavelcade.com/abspos.html and help me understand why my nested, absolutely positioned divs are being positioned with respect to the page rather...
14
2181
by: Marco Bakker | last post by:
http://www.iboi.nl/dev/ Tested with: Safari 1.2.2 (Mac) Firefox 0.8 (Mac) IE 5.2.3 (Mac) Camino 0.8 (Mac) IE 6 (Windows) Opera 7.5 (Mac)
9
6255
by: Faz | last post by:
Hi I'm having some real trouble with a header I have created within a container. I have two problems; firstly the menu (a horizontal UL) will not centre within the surrounding header, despite attempts to use the following within the #header declaration: margin-left: auto; margin-right: auto; The image above the list is easily centred using the 'text-align' property,
15
13504
by: red | last post by:
How do I center two side by side divs ? I've been writing css pages for a while but there's one thing tha still eludes me. I can center a div with margin auto. I can place two divs side by side with float. But I can't center two side by side divs. If I float them and give them auto margins, the auto margins are ignored. If I wrap the two floated divs in another div, the two divs have no
6
1391
by: Simon Wigzell | last post by:
I have the following funciton that centers my website content for any size window and will center it in real time as the window is expanded or shrunk. It is activated by a onresize="CenterIt();" in the body tag. Works fine for IE. How do I make it compatible with netscape and most browsers? Better yet, is there a good single source that explains how to write javascript to be compatible with all browsers? 766 and 435 are the width and...
4
2109
by: Alan Silver | last post by:
Hello, Having been a light reader of this ng for a few months now (after several years absence), I have noticed that absolute positioning seems to be considered a Very Bad Thing around here. Generally, when someone posts a question about a design that uses it, they are told not to. Now, in my ignorance, I don't see what's wrong with it, when used sensibly. Let me say straight off that I am *not* talking about trying to produce...
5
4821
by: Markus Ernst | last post by:
Hello This is a test example: http://www.markusernst.ch/anthracite/ http://www.markusernst.ch/anthracite/living_divani.html After googling and experimenting for several hours, I ended up doing this demo with tables. The main problems are the vertical centering of the info area, and of the text inside the squares.
6
2916
by: Mark | last post by:
hi, i'm trying to position something in the top right corner of a container, but i can't seem to figure out how to get it working. here's the html <div class='thumb'><a href='image.jpg'><img src='photos/thumbs/ bigsmile.jpg'></a><a class='del' href='?p=gallery&del=2'>x</a></div> where 'thumb' is my container, and 'del' should be aligned to the top right. here's the css
20
2813
by: mehstg1319 | last post by:
Hi there Not sure if anyone can help me, I am working on a site for my university, and am having a bit of trouble with css positioning. I am very new to css and do not know very much about it. Here is the link: http://homepages.feis.herts.ac.uk/~bp6ar/bus_intel/matrix/matrix.html Basically, the problem is that the ticks on the grid look perfectly
0
8861
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8739
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9383
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9236
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9154
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8051
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6681
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
4502
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4762
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.