logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 12-11-2014, 04:33 PM   #1
jmgravell
 
Join Date: Dec 2014
Posts: 4
Default Div Floats

Hi all,

I was wondering if you'd be able to help me out?

Essentially, what I'd like is to have 3 Div styles/tags next to each other in the form of text boxes with black borders.

How would I go about doing this?
jmgravell is offline   Reply With Quote
Old 12-12-2014, 01:14 AM   #2
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,175
Default

you answered your self in the subject. Float them left and they will position themselves horizontally inline
you could if you wanted create a class and apply it to any object
.fleft{ float: left;}
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 12-12-2014, 08:29 AM   #3
jmgravell
 
Join Date: Dec 2014
Posts: 4
Default

Quote:
Originally Posted by edbr View Post
you answered your self in the subject. Float them left and they will position themselves horizontally inline
you could if you wanted create a class and apply it to any object
.fleft{ float: left;}
I'm able to do it with the text and I think that's due to the text field width being as long as the text itself. What I can't figure out is how to include in the string, width for the black box as well as keeping the float..

Apologies if I'm being vague, I kind of don't know how to explain it properly.

Regards,
Jordan
jmgravell is offline   Reply With Quote
Old 12-12-2014, 08:41 AM   #4
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,175
Default

is it live? when yu say text fields do you mean form elements or divs??
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 12-12-2014, 08:50 AM   #5
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,175
Default

does this help??
Code:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<style>
.box{ width: 300px; float:left; border:#000 solid 2px;}


</style>
</head>

<body>
<div class="box">kgggggggggggggggggggggggggggggggggggg</div>
<div class="box">kgggggggggggg<br>
<br>
gggggggggggggggggggggggg</div><div class="box">kggggggggggggg<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
ggggggggggggggggggggggg</div>
</body>
</html>
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 12-12-2014, 09:04 AM   #6
jmgravell
 
Join Date: Dec 2014
Posts: 4
Default

Quote:
Originally Posted by edbr View Post
does this help??
Code:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<style>
.box{ width: 300px; float:left; border:#000 solid 2px;}


</style>
</head>

<body>
<div class="box">kgggggggggggggggggggggggggggggggggggg</div>
<div class="box">kgggggggggggg<br>
<br>
gggggggggggggggggggggggg</div><div class="box">kggggggggggggg<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
ggggggggggggggggggggggg</div>
</body>
</html>
That's it! Brilliant, thank you very much! I'll look at the code and try to figure out what I was doing wrong.

Here is the code I used - I've just put all examples in one snippet:
Quote:
<p><div class="boxed" style="border:solid 2px #000" float:left; width><br>
**This text is enclosed in a box.</div>
</p>

<div style="border:solid #000 2px" float:left;> Text Here </div>

<div style="border:solid #000 2px" float:left;> Text Here 2 </div> <div style="float:left" style="border:#000 2px">

<div style="border::#000 2px>
<p>Can this work?
</style></div>

</p>
<p>&nbsp;</p>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<p>
<style>
.box{ width: 300px; float:left; border:#000 solid 2px;}


</style>
</head>

<body>
jmgravell is offline   Reply With Quote
Old 12-12-2014, 09:09 AM   #7
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,175
Default

try not to use inline styles
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 12-12-2014, 09:48 AM   #8
jmgravell
 
Join Date: Dec 2014
Posts: 4
Default

Will do

Thanks again.
jmgravell is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 11:48 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com