PDA

View Full Version : centering div's


fabian9931
04-12-2008, 03:55 AM
hello everyone. so far this is what i have been doing, i am a begginner on dreamweaver and the best way i know how to center content is by putting this

<div "center"><div align="center"> ***then my content***</div>

but when i type. my text obviously goes from the left side on my monitor to the right side so what i do is. in photoshop i make a jpeg with the same color as my background and insert text there. save that as a jpeg then insert that picture into my code that i have pasted up top.

i have tried centering my content the other way that i found by searching here on the forums but i this way is easier for me because i cant seem to understand and get the other way right.

so my question is how can i have two div's side by side with text not a picture?

Cary
04-12-2008, 05:21 AM
You can style a div so it has a width and left and right margins set to auto, or you could have a <p> tag for instance with style set to "text-align:center". I'm not sure what you intend for the code you have above to do. <div "center"> isn't valid. Was it a typo?

edbr
04-12-2008, 05:29 AM
how can i have two div's side by side with text
float: left ; you need to look at css then style your divisions ie text-align:center;

edbr
04-12-2008, 05:41 AM
Sorry Cary I completely missed your reply

fabian9931
04-12-2008, 11:48 AM
You can style a div so it has a width and left and right margins set to auto, or you could have a <p> tag for instance with style set to "text-align:center". I'm not sure what you intend for the code you have above to do. <div "center"> isn't valid. Was it a typo?

so i would do something like this? <p> margin left 150, margin right 150, text-align:center, ***insert text here***<p>?

Ricky55
04-12-2008, 01:19 PM
This would centre a div


<style type="text/css">

#content {
width: 768px;
margin: 50px auto 0 auto;
}

</style>
</head>

<body>
<div id="content">Your Content</div>
</body>
</html>


to align the text inside the div see what the others have said.

fabian9931
04-12-2008, 01:36 PM
This would centre a div


<style type="text/css">

#content {
width: 768px;
margin: 50px auto 0 auto;
}

</style>
</head>

<body>
<div id="content">Your Content</div>
</body>
</html>


to align the text inside the div see what the others have said.


this would let me have two divs next to each other for lets say 2 paragraphs of text or whatever?

Ricky55
04-12-2008, 02:53 PM
no this would though:


<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">

#container {
width: 480px;
margin: 50px auto 0 auto;
}

.one {
background: #666;
color: #fff;
width: 220px;
float: left;
padding: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
}

.two {
background: teal;
color: silver;
width: 220px;
float:left;
padding: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: .8em;
}


</style>

</head>

<body>

<div id="container">
<div class="one">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to</div>
<div class="two">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to</div>
</div>

</body>
</html>

Death Dream
04-12-2008, 10:24 PM
margin: 0 auto;

Put this in your style sheet within your div you want to have centered.

~Death Dream~

fabian9931
04-12-2008, 11:14 PM
margin: 0 auto;

Put this in your style sheet within your div you want to have centered.

~Death Dream~

here does that go exactly? i put it in the div and it would show as text.

Ricky55
04-13-2008, 03:28 PM
just follow what I said that last comment was just a confusing repeat of what had already been said

Corrosive
04-14-2008, 12:11 PM
what i do is. in photoshop i make a jpeg with the same color as my background and insert text there. save that as a jpeg then insert that picture into my code that i have pasted up top.

Whatever you do Fabian, don't do this! Your site will be entirely jpegs and search engines will see no content at all. If you ever want your site to be found then this is a bad idea and will only lead to heartbreak. :(

Keep persisting with CSS. You will get there in the end and the posts here are correct for how to centre a div.

Good luck :-D

Ricky55
04-14-2008, 03:54 PM
Corrosive is dead right putting a bunch of images. Into a page and saving as HTML is not web design. If everyone did this google would go out of business as no site would be found.

Rob_Che
04-14-2008, 07:01 PM
haha... I made this error in my early days (i'm sure most here did) - learn from our mistakes ! :D

Corrosive
04-15-2008, 08:01 AM
haha... I made this error in my early days (i'm sure most here did) - learn from our mistakes ! :D

Yep, I did.