DIV overlapping - HTML / CSS

The div is overlapping the H2 tag. Why?
The adspace may or may not be there... so I cant explicitly set the width of the H2. It should fill up the space available. Thanks

[PHP]<div id="adSpace" style="display:block;float:right;width: 160px; height: 500px; border: 1px solid green;">
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
</div>

<h2 style="border: 1px solid blue; background: #9A2A3A; ">
This is a title
</h2>
[/PHP]

Sep 4 '07 #1

Subscribe Post Reply

2014

drhowarddrfine

7,435

Expert 4TB

You have to remember that when you float an element, that element is removed from the normal flow and that is why they are overlapping.

Sep 4 '07 #2

jzeil

so how would i fix this?

If you place an HR tag after the H2 you will see how I would like for the H2 to span.

Sep 4 '07 #3

drhowarddrfine

7,435

Expert 4TB

The easiest is to just put the ad div after the h2 and float it right like you are. This may still depend on what content would be displayed to the left of it.

I have a dentist appointment right now so I have to leave.

Sep 4 '07 #4

jzeil

naw still doesnt solve it. The code I posted is the root of the problem. The problem exists in a bigger document. There will be H2s above and below the ad. The ad wont always appear either.

Sep 4 '07 #5

drhowarddrfine

7,435

Expert 4TB

Something like this:
[HTML]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title></title>

<style type="text/css">

h2{background: #9A2A3A;}
#outer{
position:relative;
overflow:auto
}
#adSpace{
float:right;
width:160px;
height:500px;

}
</style>
</head>

<body>

<h2>
This is a title
</h2>
<div id="outer">
<div id="adSpace">
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here. Ad goes here.
</div>
</div>
<h2>
This is a title
</h2>

</body>
</html>[/HTML]

Sep 4 '07 #6

Similar topics

overlapping regex

by: km | last post by:

Hi all, python re module deals with only nonoverlapping matches. how to go for if i want to find out overlapping matches and their span ? regards, KM

Python

Overlapping matches in Regular Expressions

by: André Søreng | last post by:

With the re/sre module included with Python 2.4: pattern = "(?P<id1>avi)|(?P<id2>avi|mp3)" string2match = "some string with avi in it" matches = re.finditer(pattern, string2match) .......

Python

Merging overlapping spans/ranges

by: Max M | last post by:

I am writing a "find-free-time" function for a calendar. There are a lot of time spans with start end times, some overlapping, some not. To find the free time spans, I first need to convert the...

Python

Calculating Hours with Overlapping Times

by: Phil Sandler | last post by:

All, I have a table with start and end dates/times in it, and would like to be able to calculate the number of hours represented, accounting for overlapping records. Note that I am looking...

Microsoft SQL Server

std::copy for overlapping ranges?

by: Simon Elliott | last post by:

Is there an equivalent of std::copy which works on STL containers for overlapping ranges? -- Simon Elliott http://www.ctsn.co.uk

C / C++

Aligning overlapping controls

by: Bruce | last post by:

Hello, Back in the Access 97 days, if I had two texboxes on a form or report that overlapped, and I selected both and did a Format, Align, Top from the menu in design view, the controls would...

Microsoft Access / VBA

Declarations of structs, and arrays seem to be overlapping in memory..?!

by: David Thorp | last post by:

New to this list (first post), and relatively new to C, so hi everyone... If anyone can help me with this I'll be most grateful... The following code is from a rather elaborate (for me) program...

C / C++

Overlapping controls

by: Charlie Brown | last post by:

I have a form with 2 custom controls that can be dragged around by a user. How can I check if they overlap each other without performing some kind of Collision detection on them? Is there...

Visual Basic .NET

String functions and overlapping objects

by: =?ISO-8859-15?Q?Jean=2DFran=E7ois?= Lemaire | last post by:

Hello all, I'm learning C and I still am struggling to understand some basic concepts. For example, I read in the standard that with functions such as strcpy, 'If copying takes place between...

C / C++

Plotting non overlapping adjacent rectangles

by: cowboyrocks2009 | last post by:

Hi, I am trying to write a Java program to plot rectangles with different colors side by side non overlapping but unfortunately I am unable to do that as of now. Suppose I want to create 3...

Java

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

Microsoft Access / VBA