Hi,
I have a problem styling a definition list.
If you look at http://68.178.211.60/MattRandle/Guid...arginalsNZ.htm
you will see the effect I am trying to achieve. If, however, the
flower image is smaller than the description text that appears to its
right, I cannot get the next definition term to clear the image.
Scroll down the page to 'Saururus' and 'Scripus' and you will see what
I mean.
Snippet of HTML is,
<dl>
<dt>Pontedeia </dt>
<dt class="image">< img src="Guides/Plants/pontederia.jpg" ></dt>
<dd>Text goes here</dd>
</dl>
The CSS is,
..pics dt {
margin: 0 0 10 0;
}
..pics dt.image {
width :200;
text-align: right;
float: left;
}
..pics dd {
padding : 0;
margin: -5 0 0 220;
}
A cannot clear:left on the .pics dt because the navigation column on
the main page is floated left.
Any advice appreciated.
Thanks in advance,
Matt 10 2021 ma*********@yah oo.com wrote: I have a problem styling a definition list. If you look at http://68.178.211.60/MattRandle/Guid...arginalsNZ.htm
you will see the effect I am trying to achieve. If, however, the flower image is smaller than the description text that appears to its right, I cannot get the next definition term to clear the image. Scroll down the page to 'Saururus' and 'Scripus' and you will see what I mean.
Mozilla/SM v1.0.0.
Well, no, I don't see what you mean. It all looks the same. I see the
resulting layout but how is that different from what you envision?
What does "clear the image" mean?
What browser(s) have you tried?
Correct your validation errors.
Use HTML 4.01 Strict DTD, not transitional. (And the DTD you do specify
is incomplete.)
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email) Mozilla/SM v1.0.0. Well, no, I don't see what you mean. It all looks the same. I see the resulting layout but how is that different from what you envision? What does "clear the image" mean? What browser(s) have you tried?
Correct your validation errors. Use HTML 4.01 Strict DTD, not transitional. (And the DTD you do specify is incomplete.)
-- jmm (hyphen) list (at) sohnen-moe (dot) com (Remove .AXSPAMGN for email)
I have tried it in IE6 and Firefox. Same effect.
By "Clear the image" I mean that the heading for the next flower should
start on the next row, and not to the right of the previous image.
Maybe you have large text size set so you are not getting the same
effect ? As I said in my original post, the problem only happens when
the text to the right of the image is smaller than the image.
Matt
Just to be clear, the text for 'Saururus' is smaller than the
associated image so that 'Scripus' doesn't start on the next line
(because the image is floated left).
Thanks for the DOCTYPE advice. I am new to web design. I found a good
article on A List Apart that explains the issues. ma*********@yah oo.com wrote: What does "clear the image" mean?
By "Clear the image" I mean that the heading for the next flower should start on the next row, and not to the right of the previous image. Maybe you have large text size set so you are not getting the same effect ? As I said in my original post, the problem only happens when the text to the right of the image is smaller than the image.
Yes, I have a minimum font size set so I can force too-small fonts to a
size I can read.
Use a <div> to wrap the <dl>. Then you can add clear:both to the <dt>.
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Jim Moe wrote: Use a <div> to wrap the <dl>. Then you can add clear:both to the <dt>.
Bzzt! Wrong! That does not work.
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Jim Moe wrote: Jim Moe wrote: Use a <div> to wrap the <dl>. Then you can add clear:both to the <dt>. Bzzt! Wrong! That does not work.
-- jmm (hyphen) list (at) sohnen-moe (dot) com (Remove .AXSPAMGN for email)
The problem doesn't appear in Opera only in IE
THere is a list of IE bugs around
I'll look for it
Bernard
matt_randle wrote: <dl> <dt>Pontedeia </dt> <dt class="image">< img src="Guides/Plants/pontederia.jpg" ></dt> <dd>Text goes here</dd> </dl>
This doesn't answer your question, but I would have thought that the image
would be better in a DD rather than a DT, as it appears to be part of the
definition.
What is a Pontedia? It's this: [image].
--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: Joseph Haig |
last post by:
I am trying to use descriptive lists, <DL>, as shown in
<http://www.maths.man.ac.uk/~jhaig/tmp/test.html> with a style sheet
at <http://www.maths.man.ac.uk/~jhaig/tmp/default-2.css>. With
Mozilla and Opera they appear correctly, with a border round both the
<DT> and <DD> parts but in Internet Explorer the borders are messed
up. Can anyone please tell me where the mistake is?
As an aside, the <div id="main"> section should have the...
|
by: Peter Collinson |
last post by:
Hi...
Is there any way to style a List Item a different color and size than
the <LI> in an Ordered List?
I'd like a red super-script number and a dark blue text in a page's
footnotes. And this be done using style sheets?
--
- Yours truly, Pete Collinson
|
by: skeeterbug |
last post by:
not sure what i'm doing developing on xmas... but i guess we all have
our own demons! -lol-
i'm using the following css to style my horizontal menu...
/* STYLE HORIZONTAL MENU */
#hmenu ul
{
list-style: none;
|
by: Lucas, Todd |
last post by:
Hello everyone! I'm having a problem with a WebControl that I'm designing
for a Menu. I've been at it for about 3 weeks now, and can't seem to get
around this problem. So I'm hoping that someone can help me ...
My environment: VS 2003 v7.1.3088, Win2K v5.0.2195 SP3, IE6 v6.0.2800.1106
browser.
I have a class (C3Menu) derived from WebControl, with a property (MenuItems)
that is a collection of menu items. The collection property is...
|
by: ashkaan57 |
last post by:
Hi,
How can I set up the styling for different levels of <ULto use
different images for bullets, be indenetd differently, ...
Like:
.. list 1
- item 1
- item 2
.. list 2
| |
by: TomT |
last post by:
I am having a difficult time solving a problem. Whenever I use :hover in a certain <div> the page shrinks in IE6. Of course, this problem does not exist with other browsers. It is even more vexing because this only happens in the <div> with the main content, not the <div> that contains the navigator with links to the content. Below I will append the pared down code.
Briefy, I want to create a page that has a very long article. That article...
|
by: Lars Eighner |
last post by:
I take this example from a writer in alt.usage.english
<news://r3jie3p93s1eaflgcckn2hinf3li4mnfud@4ax.com>, where the question
of whether the "and" is required came up strictly as an issue of English
usage, because it illustrates a recurring problem in HTML markup.
How should this be marked up? Yes, generally, "Bob went to the store..."
is marked up in P and the items as LI in OL. But logically, the list
belongs to the paragraph. ...
|
by: strife |
last post by:
Hey everyone,
I was making a program for a class, and I ran into a problem that is driving me crazy. I first suspected Vista, and since I am not home I cannot verify if it just my Vista computer, anyway, here is the problem.
I know this is a lame program, but I lacked the creativity to come up with a program including all the required items in three days. I ended up getting 351/585(60%) on this because, I didn't include 2 arrays,...
|
by: amitabh.mehra |
last post by:
Hi
I havent used MQT before. Read the online tips and tutorials but none
seems to give any hint for my problem.
I have a base table (base_table) as:
st varchar(25) default 'my_null'
dt timestamp default
'1900-01-01-00.00.00.00000'
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it.
First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
| |
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 tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
|
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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
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 presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
| |
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |