|
HTML - Keep Text In Line With A <h1>
Hey everyone and thanks ahead of time for takin a look see at this!
I'm working on creating a headline for one of my pages that I want to have some sort of 'text' decoration on each side of it like this: -----[blah blah]------ Now I want the title ('blah blah' in this case) to be in a <h1> tag...but not the decoration on the outside. However when I set it up like: Code: ----[<h1>blah blah</h1>]---- As you would guess the result is: -----[ Blah Blah -----] Is there someway I can keep these inline, but still have an <h1> tag wrapped only around the title? THANKS!! Similar Tutorialshere is the (ineffective) code currently: <img style="float: left; width: 169px; height: 73px;" src="img/logo1.png" alt="" /> <h1 style="text-align: center;">random text</h1> the image shifts the left margin such that the text is centered as though the page width was 169px less than it really is. i'm not debating the code itself; the code above behaves as its meant to. aka no surprises. i just cant figure out the appropriate code to center the text across the entire real width of the page as though there was no image. i've tried div tags & all the things google hunting advised. no luck. other than finding this forum, which seems like it'll be a boon! thanx in advance for advise/comments/feedback/help. Hi all, I have the following code... <BODY> <ul> <li><h3> hello world</h3> I love you </li> </ul> </BODY> Right now this comes out on two separate lines. Is it possible for both texts to be on the same line? Thanks. http://credmond8.awardspace.com/home.phtml How can I get "Site Theme" and "Time" on the same line? Hi, I am writing various things on one line - such as Previous, Back to Main Menu and Next - but would like to align the differently e.g. I would like "previous" to be aligned to the left of the page, "back to Main Menu" in the middle and "Next" on the right side. I have tried pressing space bar - but am only able to do one space in Dreamweaver. Any ideas? Thanks. Hi guys, can someone help me. I'm trying to get my text to sit like this: however it sits like this: www.studioeighty.co.uk thanks Steve please, check http://members.dodo.com.au/~rouslan/...ite/index.html I need to know how to get rid off strange effect down the bottom and how do I make text and image aligned on the same "line", "level" e.g. image image text text text text text text text text image image text text text text text text text text image image text text text text text text text text image image text text text text text text text text I am trying to do something pretty basic, but I dont understand the behavior or how to fix it. I want something to look like (where the '*' are centered): Code: *
*
test *
*
*
*
and am using the code: Code: <CENTER>*</CENTER> <CENTER>*</CENTER> test<CENTER>*</CENTER> <CENTER>*</CENTER> <CENTER>*</CENTER> <CENTER>*</CENTER> But the output looks like: Code: *
*
test
*
*
*
*
Hi, I want to create a header (<h1>,<h2>,...) like on the picture (see attachment) with html and css. It is possible to create sth like that without using pictures? Thanks Hi I am having trouble on this topic, can't think of a way to clearly explain this so i ll just throw an example: I'm aiming for this in a table: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXX______________________________ without the need to do line break or start a new <span><div>or<td>, so basicly the text content (the "X"s) is continuous and the underline needs to fill the whole horizontal width, making <u> an invalid solution. Does anyone know how to make this possible, Thanks in advance! P.S. I am using query to auto fill the text content so the length of the text is not fixed and will change base on the database record I was wondering if someone could point me in the right direction here. Given the following: <html><body><table border=1><tr> <td style='vertical-align: bottom;'><pre>Here is one line of preformatted text inside a td tag</pre></td> </tr></table></body></html> Firefox and Internet Explorer display the preformatted text with an extra blank line after the text. Safari seems to display this as I would expect (with no implicit blank line). I've tried playing around with the border, margin, and padding styles, but I can't seem to get rid of the extra blank line within the <td>. Anyone have any ideas ? Thanks, John Dear all, currently i m having trouble centralizing my buttons in a horizontal line with my text above it. I m hosting my things on blogspot and on a html preview, my html code seems correct for ''my buttons in a horizontal line with my text above it''. But with blogspot, my buttons are vertical instead. My website is www.buttonsupcloset.blogspot.com Below is the sample of my image followed by the text and buttons. <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/101.jpg" /> <table width="800"> <tr><td> <p style="text-align: center;">Sweet Bustier Top (White) <center> <a href="http://ww12.aitsafe.com/cf/add.cfm?userid=E7247990&product= Sweet+Bustier+Tube+(White) &price=22&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/addcart.gif" border="0" /></a> <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E7247990&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/preview.gif" border="0" /></a> <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E7247990&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/checkout.gif" border="0" /></a> </center> </td> <td> <p style="text-align: center;">Sweet Bustier Tube (Purple) <center> <a href="http://ww12.aitsafe.com/cf/add.cfm?userid=E7247990&product= Sweet+Bustier+Tube+(Purple) &price=22&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/addcart.gif" border="0" /></a> <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E7247990&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/preview.gif" border="0" /></a> <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E7247990&return=www.buttonsupcloset.blogspot.com"> <img src="http://s570.photobucket.com/albums/ss147/buttonsupcloset/checkout.gif" border="0" /></a> </center> </td> </table> Hoping someone could help me solve this problem. regards, goddha Hi, I am doing a small project. In that I am displaying percentage visually with the help of horizontal line using width. when the user places cursor on that line, is there any chance to show percentage of that line. Eagerly waiting for your replies. Thanks in advance, I want to align some text on opposite sides of the same line, ie: (but obviously without the underscore) <<<previous_____________________________________________________________ next>>> and I'm not sure how as if I just use p align, the "next" will be one line below the "previous"... any suggestions? thank you! I'm trying to position text, links and pictures to follow one after the other, but it doesn't work. I want to see "Homepage" on the left corner of my webpage "Next" on the right corner of my webpage Unfortunately this command doesn't work properly. <div style="text-align:left;solid 2px #ff0000;"><a href="F:\Webcomic\Website Folder\NWvisuals-Index.html"> Home</a> <p align=right><a href="F:\Webcomic\TheEyeoftheWorld3.html">Next</a></div></p> It makes the "Next" go down a line, instead of being in the same line of the "Homepage". Also, on that vein, is there any way I can align images and text on the same line without using spaces*? As in: <p align="left">Hello</p> <p align="center">Hello</p> <p align="right">Hello</p> But they all should stay on the same line. Any guides, or even links to tutorial about my issue would be appreciated. I've been trying to google for a while, it's becoming frustrating. *I think the problem with spaces is that people with different resolution would see the text in different places than I want them to see. I'm using tables and I have text inside one table. When I add line height to text so it looks good in IE6, Safari and Google Chrome, it looks wrong in FireFox and Opera. Every line is over each other. How could I fix this? Here is the code from start to end of the text part: Code: <html>
<head>
<link rel="stylesheet" type="text/css"
href="style.css" />
<title>my site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-image:url('tausta.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FFFFFF;
line-height: 5%;
}
.style2 {color: #
color: #999999;
color: #999999;
}
.style4 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #999999; line-height: 5%; }
.style5 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #999999; line-height: 5%; font-weight: bold; }
-->
</style></head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div class="page">
<table id="Table_01" width="912" height="543" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="14" width="176" height="542" valign="top"><div align="right" class="style1">
<p class="style2"> </p>
<p class="style2"><strong><u>FILES:</u> </strong><u><br>
</u><br>
<br>
<br>
<br>
</p>
</div>
<p align="right" class="style5">Images: </p>
<p align="right" class="style4">images1 <br>
<br>
<br>
<br>
</p>
<p align="right" class="style5">Videos: </p>
<p align="right" class="style4">video1 </p>
<p align="right" class="style4">video2 </p>
<p align="right" class="style4">video3 </p>
<p align="right" class="style1"><span class="style2">1 - video4 </span></p></td>
Hello all, I'm a newb at html, just started some basic coding last week. I've made my first site, though as you can see, the images and text (even if it's a placeholder right now) aren't lined up, and I'm not sure how to tell it to do that. Anybody with more expertise understand my situation, and how to fix it? Thanks! http://elliottetzkorn.com Hi guys, I got a quick question. I can't for the life of me understand why the youtube, facebook and twitter images below absolutely insist on having a few pixels of space to the bottom of it's line. It makes it so the following link-text seem to be too low on the line in comparison to the image. If you see in the lower left corner of www.leveldance.com you can see what i mean. Any ideas? (I have no padding added in the css) Thanks a million in advance! HTML Code: <div class="left_col_container">
<div><img src="images/navigation/sociables_headline.png" alt="Join Our Community!"/></div>
<p style="margin-top: 5px; margin-bottom: 0px">Join the newsletter!</p>
<style type="text/css">.af-form {margin:0 !important;}</style>
<script type="text/javascript" src="http://forms.aweber.com/form/36/693624936.js"></script>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.facebook.com/leveldance" target="_blank"><img src="images/sociables/faceBook-icon.png" class="no_border" alt="Find us on Facebook!"/></a><a class="sidebutton" href="http://www.facebook.com/leveldance" target="_blank"> Find us on Facebook!</a>
</div>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.twitter.com/leveldance" target="_blank"><img src="images/sociables/twitter-icon.png" class="no_border" alt="Follow us on Twitter!"/></a><a class="sidebutton" href="http://www.twitter.com/leveldance" target="_blank"> Follow us on Twitter!</a>
</div>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.youtube.com/user/leveldancenyc" target="_blank"><img src="images/sociables/youtube-icon.png" class="no_border" alt="See us on YouTube!"/></a><a class="sidebutton" href="http://www.twitter.com/leveldance" target="_blank"> See us on YouTube!</a>
</div><br/>
</div> <!-- left_col_container end -->
I get how to align two sections of text, one at the left of screen and one on the right, but how do I put this line at the bottom of the screen? I tried pretty much every combination now, bottom:0, vertical-align:bottom, vertical-align:text-bottom, with and without a parent div container, nothing works! The moment I try to put the line of text at the bottom of the screen the left/right alignment would be messed up or it wouldn't show at all. It seems html only allows you to align it left/right OR bottom/top, but not both? Any help is appreciated. This is what I have so far: Code: HTML:
<div style="clear:both;" id="bottom">
<p class="left">Text to go on left.</p>
<p class="right">Text to go on right.</p>
</div>
CSS:
#bottom {
bottom:0;
}
.left {
float: left;
}
.right {
float: right;
}
Hi All, I am new to this forum and is expecting an answer for this question. I have implemented a facebook type search to the database which displays the familiar text saved in the database when I type some text in the database. My issue is after I have used the search box for a couple of time the text box starts displaying a similar dropdown from its history which hides my database search. Does anyone know how to disable it using html or css. See the attached Image if my question is not clear. http://www.htmlforums.com/attachment...1&d=1306715905 |
|||||||