centering | 易学教程

How to center an element that is wider than its parent element?

阅读更多关于 How to center an element that is wider than its parent element?

I currently have a div with a fixed width of 900px. I'd like to add a child iframe with a fixed width of 950px, and I'd like it to be perfectly aligned to the center. How can that be done? Thanks. .container { width:900px } iframe { margin-left:-25px; width:950px; } You can place the child at 50%, then use a negative margin that is half the width of the child: .parent { position: relative; overflow: hidden; } .child { position: absolute; left: 50%; top: 0; margin-left: -475px; } This way you only need to know the size of the child element. I found a way to do it with dynamical widths here:

Aligning div to center and its content to the left

阅读更多关于 Aligning div to center and its content to the left

问题 I'd like to have a div that is centered on the document. The div should take all the space it can to display the content and the content itself should be aligned to the left. What I want to create is image gallery with rows and columns that are center and when you add a new thumb it will be aligned to the left. Code: <div id="out"> <div id="inside"> <img src="http://www.babybedding.com/fabric/solid-royal-blue-fabric.jpg"/> <img src="http://www.babybedding.com/fabric/solid-royal-blue-fabric

jQuery function triggered on window resize but not on page load

阅读更多关于 jQuery function triggered on window resize but not on page load

I found this jQuery code that allows to center a div that doesn't have fixed dimensions both horizontally and vertically. It works with the window height and width. So when I resize the window, the div is still centered within the window. My issue is that, right now, it doesn't work unless I resize the window first. So if I just load the page, the div isn't centered unless I manually resize the window. This, of course, is not ideal. So I'm trying to find a way around it. But my jQuery skills being very limited I'm stuck right now. Here's the page I'm working on: http://dev.manifold.ws/test2/

why won't this css button center inside div?

阅读更多关于 why won't this css button center inside div?

问题 So... this is starting to annoy me ... and I thought i would come here and get some help.. The main div around the box has a width... then there is text... and a button that i want in the center of the div.. it is a <a href> button.. but it wont center. I didn't think I would need to specify a width since the outside div has a width.. i tried margin:0 auto; text-align:center etc nothing works <h2 class="service-style color_service">Annoyed</h2> <div class="service-text text1"> <p> Lorem ipsum

How can I center align an element that is larger than 100% of the entire page?

阅读更多关于 How can I center align an element that is larger than 100% of the entire page?

I have a div width a with of 100% and hidden overflow holding a div with a width of 3000px. I want the 3000px div to be cut off evenly on the left and right. I would use background-position:center; however, it's more complicated than that. The 3000px div is holding 30 100px divs. I have tried using auto margins on the left and right of the 3000px div, but it did not work. Here is the css: .bgAnimHolder{ width:100%; height:500px; overflow:hidden; position:absolute; z-index:1; top:0px; } .row{ margin: 0 auto 0 auto; height:500px; width:3000px; } .row div{ width:100px; float:left; margin-top:0px;

Centering Windows on screen

阅读更多关于 Centering Windows on screen

Short and sweet: How can I tell Interface Builder to center a window on a user's screen? I've seen the positioning tool on the inspector, but eyeballing doesn't always land as squarely as I like. Is this something where I should switch over to Xcode and add something to the init or awakeFromNib methods? You could use [window center] as answered by wahkiz, but that might not be exactly what you want. The documentation states that this will put the window centered horizontally, but somewhat above the vertical centre. In this way the window has a visual prominence. If you want to put your window

Center align Labels and images inside UIView programatically with Swift

阅读更多关于 Center align Labels and images inside UIView programatically with Swift

问题 Im working on an app and came across a problem that I cant seem to solve. I am making a uiview with labels and images inside it. The content needs to be centered inside the view. The problem is that the label will hold different lenght texts and the view itself will have different width depending on where it is used. Here is how it should look: And here with longer text: As you can see there should be 1 label to the left, one uiimage in the middle and another label to the right all centered

CSS margin auto not centering

阅读更多关于 CSS margin auto not centering

I have simplified the code as much as possible, but still can't get it to center. I believe my inexperience with CSS is not allowing me to see something extremely simple. If anyone also knows some good resources for css, that'll be great. I have read sections of many CSS books but there all very basic and cover the same thing. CSS Markup: /* MAIN ––––––––––––––––––––– */ html { /* overflow-y:scroll; */ } body { /* margin:0; */ /* position:relative; */ } /* Form ––––––––––––––––––––– */ #form { margin:0 auto; width: 300px; height: 200px; display: inline-block; border: 2px solid black; } index

Creating a vertically and horizontally centered html div

阅读更多关于 Creating a vertically and horizontally centered html div

I am trying to create a page similar to Google's homepage. It is to have a centrally located input box and a div on top of the page displaying links. I also want the page to resize itself dynamically if I change the size of the browser window. I have achieved partial success using yui2 grid css and a table. Here's a snippet: <body> <div id="doc3"> <div id="hd"><a style="float:left" href="link1.com"> link1</div> <div id="bd" style="display: table; height: 400px;"> <div style="display: display: table-cell; vertical-align: middle"> <input name="searchbox" value="searchinput" size="40" /> <input

PHP GD - Align text center-horizontally and decrease font size to keep it inside the image

阅读更多关于 PHP GD - Align text center-horizontally and decrease font size to keep it inside the image

问题 Hope you are doing great. I’m still a newbie with php so after making some reading and while checking some posts here I was able to put some text over an image with the imagecreatefrompng() function using the PHP GD, users will come to a form and they will be able to enter their name and the name will be written over the image , unfortunately I have been unable to align the text center horizontally, I tried all ways possible (my ways obviously and must be wrong) with imagettfbbox but I failed