The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Why can't I position my ads correctly?
roccojade
post Nov 17 2016, 03:20 AM
Post #1


Novice
**

Group: Members
Posts: 29
Joined: 6-November 16
Member No.: 24,917



Hello,

Thanks Guys for all the help you have been so far. I am making some headway here.

I've attached an image from Dreamweaver of what my webpage is supposed to look like. But when I upload it, the ads are both flush left, pushing everything else down.

Code:
CODE
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Rocco and Jade</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css">
</head>

<body>
<!--Banner-->
<div id="banner">
<img src="images/rocco-&-jade-final-text.png" width="770" height="130" alt="Rocco&Jade Teach You How to Intensify Your Sex Life"/>
</div>
<!--Banner End-->



<div id="ad1">
<!--Left Ad-->
<img src="images/rocco-and-jade-limited-time-offer-ad.png" width="240" height="400" alt=""/> </div>
<!--Left Ad Ends-->

<!--Right Ad-->
<div id="ad2">
<img src="images/rocco-and-jade-referral-plan-.png" width="240" height="400" alt=""/> </div>
<!--Right Ad Ends-->

<!--Container1-->
<div id="container1">

    <h3>    Let us help you to take your sex life<br>
    to the next level!</h3>
<hr>
<p2>This is Cutting Edge Information</p2>
<hr>
</div>
<!--Container1 End-->    
<!--Container2-->
<div id="container2">

<h4>Rocco</h4>
<div id="text">
    <p1>Hello, my name is Rocco Martinez. I'm here with my beautiful wife, Jade.
    We want to show you some things you won't want to miss!</p1></div>
<h5>Jade</h5>
<p1><blockquote></blockquote></p1>
<h4>Rocco</h4>
<p1><blockquote></blockquote></p1>
<h5>Jade</h5>
<p1><blockquote></blockquote></p1>
<h4>Rocco</h4>
<p1><blockquote></blockquote></p1>
<h5>Jade</h5>
<p1><blockquote></blockquote></p1>
<h4>Rocco</h4>
<p1><blockquote></blockquote></p1>
</div>


</body>
</html>


CSS:
CODE

@charset "UTF-8";
/* CSS Document */

#banner {
text-align: center;
margin-bottom: auto;
    }

div#container1 {
    width:700px;
    margin-top: 30px;
    margin-right: auto;
    margin-bottom: auto;
    margin-left: auto;
    background: #fff;
    }

div#container2 {
    width:800px;
    margin: auto;
    background: #fff;
    text-align: left;
    }

div#ad1 {
    position: absolute;
    left: 0px;
    width: 250px;
    height: 400px;
}

div#ad2 {
    position: absolute;
    right: 0px;
    width: 250px;
    height: 400px;
}

div#text{
    width: 750px;
    background: #fff;
    text-align: left;
    font-family: "times new roman",serif;
    letter-spacing: 0px;
    font-size: 24px;
    text-indent: 0px;
    margin-top: 0;
    margin-left: 50px;
}

table {
    text-align: center;
    width: 800;
    object-position: center;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    }

#bookimage {
    text-align: center;
    margin-top: 40px;
    }

h1 {
    font-family: Cambria, sans-serif;
    letter-spacing: 0px;
    text-align: center;
    color: #ff0000;
    font-size: 32px;
}

h2 {
    font-family: Verdana, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", sans-serif;
    letter-spacing: 0px;
    font-size: 16px;
    color:#000000;
    text-align: center;
}

h3 {
    text-align: center;
    font-family: "Times New Roman", Times, serif;
    font-size: 44px;
    font-weight: 900;
    margin-top: auto;
    }

h4  {
    font-family: Verdana, sans-serif;
    letter-spacing: 0px;
    font-size: 30px;
    color: darkgoldenrod;
    font-weight: 900;
    text-align: left;
    margin-bottom: auto;
    margin-top: 20px;
    }

h5 {
    font-family: Verdana, sans-serif;
    letter-spacing: 0px;
    font-size: 30px;
    color: mediumseagreen;
    font-weight: 900;
    text-align: left;
    margin-bottom: auto;
    margin-top: 20px;
}

p2 {
    text-align: center;
    font-family: Verdana, san-serif;
    font-size: 24px;
    font-weight: 900;
    font-variant: small-caps;
    }


Attached thumbnail(s)
Attached Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
roccojade
post Nov 17 2016, 03:22 AM
Post #2


Novice
**

Group: Members
Posts: 29
Joined: 6-November 16
Member No.: 24,917



div#ad1 is the green one.
div#ad2 is the black, fireworks one.

This post has been edited by roccojade: Nov 17 2016, 03:23 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
roccojade
post Nov 17 2016, 05:02 AM
Post #3


Novice
**

Group: Members
Posts: 29
Joined: 6-November 16
Member No.: 24,917



Sorry I did not say, domain is www.roccoandjade.com.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
roccojade
post Nov 17 2016, 09:52 AM
Post #4


Novice
**

Group: Members
Posts: 29
Joined: 6-November 16
Member No.: 24,917



Never mind, issue resolved thanks!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Nov 17 2016, 10:27 PM
Post #5


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 17,581
Joined: 9-August 06
Member No.: 6



Good. But you still can't invent your own elements like P1 and P2. If you want to style paragraphs differently you can use for example classes. And P can't contain other block level elements like BLOCKQUOTE. And you shouldn't use BLOCKQUOTE for other things than longer quotations. You shouldn't use them for the indention they give in *some* browsers. You should use CSS margin or padding for that.

I'm not nitpicking. The further you get with the site, the more trouble it is to correct those things and sooner or later you'll have to. Much easier to do it right from the start.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
roccojade
post Nov 18 2016, 11:22 PM
Post #6


Novice
**

Group: Members
Posts: 29
Joined: 6-November 16
Member No.: 24,917



Thanks Pandy!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th May 2017 - 09:02 PM