Register FAQ / Rules Forum Spy Search Today's Posts Mark Forums Read
Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old Nov 27, 2008, 11:23 AM   #1
ClassicFan
macrumors member
 
Join Date: Nov 2007
Div Tag in Firefox...

So i've been designing my website in Dreamweaver and all and I tried to add text into a div tag. My website is made mainly of images and such.. So when I added the div tag, Firefox would scramble all of the images up. But how can I prevent this from happening? And what is the benefit of having actual text rather than image text on a web page?

Thanks,
Nick
ClassicFan is offline   0 Reply With Quote
Old Nov 27, 2008, 04:13 PM   #2
66217
Guest
 
Join Date: Jan 2006
Can you shoe us the page and the code? I don't think I'm understanding what you are saying.
66217 is offline   0 Reply With Quote
Old Nov 27, 2008, 06:07 PM   #3
werther
macrumors regular
 
Join Date: May 2006
yeah, without seeing the page/code it's hard to say why.

As for 'what is the benefit of text over text in images':

To start it makes it much easier to update if it's only text. You don't have to go to your graphics program and rework the image every time there is a change. Also SEO (search engine optimization). Search engines cannot index text embedded in images.
werther is offline   0 Reply With Quote
Old Nov 28, 2008, 07:44 AM   #4
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
I get what the OP is saying -- the alignment of content elements gets out of whack (the flow of the page) when a block level div is added into the mix. It's like mixing layout techniques - it aint gonna be pretty.

Of course we'll need to see the actual code to resolve the issue. Might want to convert the div to a span for the time being, that's an inline element. Or add "style='float: left'" inside that opening div tag manually (or assign an ID to the div and put that in your style sheet, the more elegant solution).

My general advice to the OP for future projects is to either start with templates (where the layout is fixed) to ensure proper layout across most browsers, or use tables in WYSIWYG mode in DW (it's default mode) or create the basic page layout BY HAND using div's and CSS once you learn the basics (preferred) and start putting content in those div's. And wrap the whole page in a master div (a single div to control total page size, background color, and ensure proper positioning and alignment of the interior elements when you start getting into absolute vs relative positioning).

How to build a basic CSS layout (learn about float and alignment)
CSS positioning basics (W3C Schools, excellent tutorial, a must read)

-jim
__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com

Last edited by SrWebDeveloper; Nov 28, 2008 at 09:02 AM.
SrWebDeveloper is offline   0 Reply With Quote
Old Nov 29, 2008, 11:49 AM   #5
memco
macrumors regular
 
Join Date: May 2008
As to using text instead of images–the benefit is that your site will be much easier to find by people using search engines. Further, not everyone visiting your website can see, so if you use actual text, those people can still have the text read to them by programs or devices designed to do so. Another plus, is that it's a lot easier to maintain your website.
memco is offline   0 Reply With Quote
Old Nov 30, 2008, 07:28 AM   #6
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by memco View Post
As to using text instead of images–the benefit is that your site will be much easier to find by people using search engines. Further, not everyone visiting your website can see, so if you use actual text, those people can still have the text read to them by programs or devices designed to do so. Another plus, is that it's a lot easier to maintain your website.
Fantastic advice. Well said.

-jim
__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   0 Reply With Quote
Old Apr 21, 2014, 01:35 AM   #7
georgemacin
macrumors newbie
 
Join Date: Apr 2014
Learn CSS Positioning... CSS Position



George
georgemacin is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
thread Thread Starter Forum Replies Last Post
on hover of a div, have 3 smaller divs appear. jonpeter Web Design and Development 13 May 13, 2014 03:07 PM
Why can't I get the middle image/div of three to center? mark! Web Design and Development 4 Oct 28, 2013 10:06 AM
Best Tag Implementations - How Do you tag? blast87 OS X Mavericks (10.9) 12 Jul 7, 2013 05:26 PM
Resolved: Using Javascript on UIWebView to get all of a particular div class troop231 iPhone/iPad Programming 9 Apr 3, 2013 07:50 AM
Clickable area not lining up with display for div? ArtOfWarfare Web Design and Development 3 Sep 25, 2012 02:24 PM

Forum Jump

All times are GMT -5. The time now is 04:30 AM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC