Jump to content

<p> css help, align..


UnknownPlayer

Recommended Posts

I have this css codes:

.align-left  { text-align: left; }
.align-right { text-align: right; }

/* display and additional classes  */
.clear {    clear: both; }
.blue   { color: #3791D7; }
.info { 
    margin: 20px 10px 5px 10px; 
    padding: 3px 0;
    border-top: 1px dashed #EFF0F1;    
}

 

Now i use this code like this:

<p class="info align-right clear"><a href="" class="date" ></a>'.$date.'</p>

And it looks like this:

fgdfe.png

Now, i wonna put Text in left and date on right, how can i do that, i tryed with:

<p class="info align-left clear">Text</p> <p class="info align-right clear"><a href="" class="date" ></a>'.$date.'</p>

But it doesn't work.

Pls help.

Link to comment
https://forums.phpfreaks.com/topic/213627-css-help-align/
Share on other sites

I am not quite sure why you are using p tags but with divs this is very easily achieved. Instead of using aligns you would use floats. Here is a basic example:

 

 

<div style="width:100px;">     <div style="float:left; width:50px; text-align:left;">Text Here</div>     <div style="float:right; width:50px; text-align:right;">Date Here</div></div>

 

 

I set widths on the divs so that the content would not overflow and push it down to the next line. I also had to use the text align property because of setting the width to 50px or the text on the right would be aligned to the left. You could extract the styles and put them in into styles if you wanted to. Hopefully that will help you get your desired result.

Link to comment
https://forums.phpfreaks.com/topic/213627-css-help-align/#findComment-1111948
Share on other sites

It works on comments but not on news :S

See pic:

20100917141640.png

Code for News is(where div dont work, part 1):

 

                    <div class="info clear">                        <div style="float:right; text-align:right;">                            <a href="kategorije.php?id='.$kat_id.'" class="readmore" >Kategorija: '.$kategorija.'</a> |                            <a href="http://dota.rs/forum/profile/'.$autor.'/" class="comments" >Autor: '.$autor.'</a> |                            <a href="vesti.php?id='.$vid.'#Komentari" class="comments" >Komentari('.$br_kom.')</a> |                            <a href="" class="date" ></a>'.$datum.'                        </div>                    </div>

 

And part 2, where div works:

 

                          <div class="info clear">                               <div style="float:left; text-align:left;">Text Here</div>                               <div style="float:right; text-align:right;"><a href="" class="date" ></a>'.$datum.'</div>                          </div>

 

 

Anyway, class info is:

 

.info {     margin: 20px 10px 5px 10px;     padding: 3px 0;    border-top: 1px dashed #EFF0F1;    }

 

 

What is wrong there? :S

Why on news it shows in front of text ?

Link to comment
https://forums.phpfreaks.com/topic/213627-css-help-align/#findComment-1112057
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.