Menu
if i have a div tag
[code=html]<div id=”content”>
<div id=”img”>
</div>
</div>
and CSS like this
[code=html]#img {position: absolute; left: 10%; top: 10;}
Would the img div still be inside the content div? I’m just trying to position my images within my content element.
[code=html]{margin-left: auto; margin-right: auto; width: (haven't checked yet);}[/code]yeah, my church page looks really good on a laptop because it is wide screen, but on my mom's computer and my dad's computer, the content is to the right edge.
It also has a big color distortion on three regular sized monitors that I've looked at. The maroon is black and the tan is yellow. I thought it might be because their screens weren't bright enough, but they are the same brightness as mine, and when I increase the resolution, the content aligns correctly, but the colors stay nasty.
anyway.. align it center instead of positioning it
[code=html]{margin-left: auto; margin-right: auto; width: (haven't checked yet);}[/code]
correct?[/QUOTE]
I was looking online and it was talking about aligning elements center with the <center> tags is becoming outdated.[/QUOTE]It was depricated back in 1998. Depricatred means that the issuing standards organization, W3C, asked us to stop using it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Giant Says</title>
<style type="text/css">
body {
border-left:solid 10em #a00;
border-right:solid 10em #a00;
margin:0;
padding:0;
}
#skip {display:none}
#navigation {
margin:0;
padding:0;
list-style-type:none;
width:5em;
position:absolute;
top:1px;
left:11em;
}
#content {
margin-left:5em;
padding:1em;
}
</style>
</head>
<body>
<p id="skip"><a href="#content">Skip to content</a></p>
<ul id="navigation">
<li>Fee</li>
<li>Fie</li>
<li>Foe</li>
<li>Fum</li>
</ul>
<div id="content">
<h1>Giant Says</h1>
<p>Lorem ipsum dolor sit amet consectetuer hendrerit et eros Vivamus non. Eu dolor accumsan ut Ut Curabitur Vivamus In porttitor iaculis orci. Aenean feugiat in nibh elit amet magna dictumst sollicitudin ac orci. Ante Ut ut lacinia at scelerisque quis sit leo neque tempus. Id venenatis Curabitur ipsum elit scelerisque Nulla orci ligula Vivamus condimentum. In et amet vel arcu orci id rhoncus.</p>
</div>
</body>
</html><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Giant Says</title>
<style type="text/css">
body {
background-color:#a00;
margin:0 10em;
padding:0;
}
#skip {display:none}
#navigation {
margin:0;
padding:0;
list-style-type:none;
width:5em;
position:absolute;
top:1px;
left:11em;
}
#content {
background-color:#fff;
padding:1em;
padding-left:5em;
}
</style>
</head>
<body>
<p id="skip"><a href="#content">Skip to content</a></p>
<ul id="navigation">
<li>Fee</li>
<li>Fie</li>
<li>Foe</li>
<li>Fum</li>
</ul>
<div id="content">
<h1>Giant Says</h1>
<p>Lorem ipsum dolor sit amet consectetuer hendrerit et eros Vivamus non. Eu dolor accumsan ut Ut Curabitur Vivamus In porttitor iaculis orci. Aenean feugiat in nibh elit amet magna dictumst sollicitudin ac orci. Ante Ut ut lacinia at scelerisque quis sit leo neque tempus. Id venenatis Curabitur ipsum elit scelerisque Nulla orci ligula Vivamus condimentum. In et amet vel arcu orci id rhoncus.</p>
</div>
</body>
</html>[code=html]<div Style="display:inline-block; position:relative; width:630px; height:630px; background:gray; text-align:center;">
<span style="display:inline-block; vertical-align:middle; height:100%"></span>
<span Style="display:inline-block; background:black; color:white; width:250px; vertical-align:middle; text-align:center;">
This is a test.<br>This works in a really weird way.
</span>
</div>[/code]0.1.9 — BETA 6.18