Center button, center button
When writing a page today, we found that text-align = "center" was written on the css page when the button was set to "center", but it didn't work, and the display attribute didn't work either, I tried to add a div to the button many times and then align the div. Here is a test description:
1. <! DOCTYPE html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Title> </title>
<Style type = "text/css">
P, input, button {
Text-align: center;
}
</Style>
</Head>
<Body>
<P> hello, hello, you are good, hello, hello, you are good, you are good </p>
<Input type = "button" value = "click to shake hands"/> <br/>
<Button type = "button"> click me </button>
</Body>
</Html>
Page effect (p labels are centered, but buttons are not centered. You can use the input and button labels to create buttons ):
2. <! DOCTYPE html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Title> </title>
<Style type = "text/css">
/* P, input, button {
Text-align: center;
}*/
Div {
Text-align: center;
}
</Style>
</Head>
<Body>
<Div>
<P> hello, hello, you are good, hello, hello, you are good, you are good </p>
<Input type = "button" value = "click to shake hands"/> <br/>
<Button type = "button"> click me </button>
</Div>
</Body>
</Html>
Page effect:
The first time I wrote a blog, I am also a beginner at the front-end. If you have any mistakes, please correct me. Thank you.
Update: because of the advice of the following comments, add text-align. The attribute specifies the horizontal alignment of the text in the element. This attribute specifies the point to which the row box is aligned, in this way, you can set the horizontal alignment of text in block-level elements. For input, button, img, and other labels, you can also set the display: block attribute to make it a block-level element, plus the width, margin: 0 auto; to center.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
